Question

可能重复：
How to find an element within an element

我正在运行一个循环来遍历每个表格行。我想访问每个表行内的元素。我该怎么做？

表格

<table>
<tr> <td class="a">x</td> <td class="b">x</td> <td class="c">x</td> </tr>
<tr> <td class="a">x</td> <td class="b">x</td> <td class="c">x</td> </tr>
<tr> <td class="a">x</td> <td class="b">x</td> <td class="c">x</td> </tr>
<tr> <td class="a">x</td> <td class="b">x</td> <td class="c">x</td> </tr>
</table>

代码不起作用：

$("tr").each(function(index) {

    // get class a text
    $(this + " td.a").text();

    // get class b text
    $(this + " td.b").text();

    // get class c text
    $(this + " td.c").text();

});

Answer 1

您可以使用children方法：

$("tr").each(function(index) {

    // get class a text
    var text1 = $(this).children("td.a").text();

    // get class b text
    var text2 = $(this).children("td.b").text();

    // get class c text
    var text2 = $(this).children("td.c").text();

});

Answer 2

jQuery函数的第二个参数是 context ：

$("td.a", this).text();

这会找到td.a内的所有this个后代。

Answer 3

如果你“正常”访问它（即不使用jQuery），你可以获得cells属性。

var trs = document.getElementsByTagName('tr'), l = trs.length, i, tds;
for( i=0; i<l; i++) {
    tds = trs[i].cells;
    // do stuff with tds
]

Answer 4

如果需要多次调用$(this)，则应将其分配给局部变量以提高性能。有关更多信息，请参阅此帖子：

$this vs $(this) in jQuery

最后，您可以使用.find()来实现您的目标：

$("tr").each(function(index) {

    var $this = $(this);

    // get class a text
    $this.find("td.a").text();

    // get class b text
    $this.find("td.b").text();

    // get class c text
    $this.find("td.c").text();

});

Answer 5

$("tr").each(function(index) {

    // get class a text
    $("td.a", this).text();

    // get class b text
    $("td.b", this).text();

    // get class c text
    $("td.c", this).text();

});

Answer 6

$("tr").each(function() {
    var $this = $(this),
        aText = $this.find('.a').text(),
        bText = $this.find('.b').text(),
        cText = $this.find('.c').text();
});

调用$（this）里面的元素？

6 个答案: