Question

与某些现有示例一样，我只想在选择器中选择第一级TD，但这里的区别在于操作是在现有选择上。

假设我有一张这样的桌子......

<table border=1>
<tr trid="1">
   <td>cell 1</td>
   <td>cell 2</td>
   <td>cell 3</td>
</tr>
<tr trid="2">
   <td>cell 1</td>
   <td>

       <table border=1>
        <tr>
           <td>cell 1</td>
           <td>cell 2</td>
           <td>cell 3</td>
        </tr>
        <tr>
           <td>cell 1</td>
           <td>cell 2</td>
           <td>cell 3</td>
        </tr>
       </table>

   </td>
   <td>cell 3</td>
</tr>
<tr trid="3">
   <td>cell 1</td>
   <td>cell 2</td>
   <td>cell 3</td>
</tr>
</table>

我想最初逐行遍历这个特定的表。我只想遍历具有“trid”自定义属性的行。

我设法做到这一点......

    $('tr[trid]').each(function(index)
    {
        //gets properties of TR here

        $('td',this).each(function(index)
        {
            $(this).css('background-color', 'red'); //turn my cells red
        });

    });

现在这可行，但我只想要第一级单元格。所以我希望TD循环忽略第二级td。

我知道如果外部循环使用了tr [trid]＆gt; td这会起作用，但是我会跳过循环的一个重要部分。我可以使用语法在现有选择上进行如下操作，即确保所选td的父级具有tr [tabid]。

这非常特别，因为无论如何我都无法添加新样式或更改现有HTML。此外，JQuery循环的顺序也很重要，因为它在运行时输出并需要保留它的序列。

谢谢：）

Answer 1

而不是

$('td',this).each(function(index)

使用

$(this).children('td').each(function(index)

示例：http://jsfiddle.net/gaby/tz2jt/1/

或更神秘（但你明白了）

$('> td',this).each(function(index)

示例：http://jsfiddle.net/gaby/tz2jt/

Answer 2

您可以使用.children()方法遍历您正在调用它的元素的直接子元素。

$(this).children('td').each(function() {
    $(this).css('background-color', 'red');
});

jquery获取现有选择中的第一级td元素

2 个答案: