通过索引获取特定元素的文本

Question

我想获取倒数第二行的文本，所以我尝试这样做：

var tradeNumEl = $("td.trade-num").length - 2;
console.log($("td.trade-num")[tradeNumEl].text())

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr>
    <td class="trade-num">100</td>
  </tr>
  <tr>
    <td class="trade-num">101</td>
  </tr>
  <tr>
    <td class="trade-num">102</td>
  </tr>
  <tr>
    <td class="trade-num">103</td>
  </tr>
  <tr>
    <td class="trade-num">104</td>
  </tr>
  <tr>
    <td class="trade-num">105</td>
  </tr>
</table>

但是它给了我

  

未捕获的TypeError：$（...）[tradeNumEl] .text不是函数

我该如何解决？这是小提琴：https://jsfiddle.net/45a9sc6k/4/

Answer 1

通过索引访问jQuery对象将返回集合中该索引处的Element对象。它不返回jQuery对象-因此出现错误。要解决此问题，请改用eq()：

console.log($("td.trade-num").eq(tradeNumEl).text());

var tradeNumEl = $("td.trade-num").length - 2;
console.log($("td.trade-num").eq(tradeNumEl).text());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr>
    <td class="trade-num">100</td>
  </tr>
  <tr>
    <td class="trade-num">101</td>
  </tr>
  <tr>
    <td class="trade-num">102</td>
  </tr>
  <tr>
    <td class="trade-num">103</td>
  </tr>
  <tr>
    <td class="trade-num">104</td>
  </tr>
  <tr>
    <td class="trade-num">105</td>
  </tr>
</table>

Answer 2

您必须使用带有索引号no的eq()作为参数。 .eq(index)将匹配的元素集减少到指定索引处的元素。

var tradeNumEl = $("td.trade-num").length - 2;
console.log($("td.trade-num").eq(tradeNumEl).text() )

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
  <td class="trade-num">100</td>
</tr>
<tr>
  <td class="trade-num">101</td>
</tr>
<tr>
  <td class="trade-num">102</td>
</tr>
<tr>
  <td class="trade-num">103</td>
</tr>
<tr>
  <td class="trade-num">104</td>
</tr>
<tr>
  <td class="trade-num">105</td>
</tr>
</table>

Answer 3

您还可以创建找到的元素的对象

///I want to get the text of the second to last table row using js and jquery. So I tried to do this:

var tradeNumEl = $("td.trade-num").length - 2;
console.log($($("td.trade-num")[tradeNumEl]).text(), tradeNumEl)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
  <td class="trade-num">100</td>
</tr>
<tr>
  <td class="trade-num">101</td>
</tr>
<tr>
  <td class="trade-num">102</td>
</tr>
<tr>
  <td class="trade-num">103</td>
</tr>
<tr>
  <td class="trade-num">104</td>
</tr>
<tr>
  <td class="trade-num">105</td>
</tr>
</table>