通过索引获取每一个?

时间:2014-02-03 10:57:33

标签: javascript jquery

我想在每一行中按索引(1)找到所有td。我怎么能做到这一点?

我的HTML:

<table>
    <thead><tr><th>Maandag</th><th>Dinsdag</th><th>Woensdag</th><th>Donderdag</th><th>Vrijdag</th></tr></thead>
    <tbody>
        <tr><td></td><td>THIS</td><td></td><td></td><td></td></tr>
        <tr><td></td><td>THIS</td><td></td><td></td><td></td></tr>
        <tr><td></td><td>THIS</td><td></td><td></td><td></td></tr>
        <tr><td></td><td>THIS</td><td></td><td></td><td></td></tr>
    </tbody>
</table>

使用Javascript:

var index = 1;
$('tbody').children().children(':eq(' + index + ')');

此代码不起作用,因为它获取行的所有子项,然后获取索引。我需要每一秒都有每秒TD。

5 个答案:

答案 0 :(得分:5)

您可以使用nth-child selector

var index = 1;
$('tbody').find('td:nth-child('+(index+1)+')');

演示:Fiddle

答案 1 :(得分:1)

工作示例http://jsfiddle.net/LZH87/

$('tbody').children().children('td:nth-child(2)').each(function() {
    $(this).css({background: 'blue'});
});

我刚刚添加了css背景蓝色以确认它有效

答案 2 :(得分:1)

这也可行(jsfiddle example

$('tbody').children().each(function(){
    $(this).find('td:odd').css({background: 'red'});
});

它在jQuery中使用:odd:even选择器。

答案 3 :(得分:1)

试试这个

$('tbody').find('tr').each(function(i){
    alert($('tbody').find('tr:eq('+i+')').find('td:eq(1)').text())
})

演示链接http://jsfiddle.net/dhana36/YT3CD/

答案 4 :(得分:1)

或者只是vanilla-js

var index = 2,
    tdElArr = document.querySelectorAll('table tbody tr td:nth-child(' + index + ')');

// to test this:
for(var i=tdElArr.length;i--;){
    tdElArr[i].style.backgroundColor = '#cdedff'
}
table {border-collapse: collapse;}
table, th, td {border: 1px solid black;}
<table>
    <thead><tr><th>Maandag</th><th>Dinsdag</th><th>Woensdag</th><th>Donderdag</th><th>Vrijdag</th></tr></thead>
    <tbody>
        <tr><td></td><td>THIS</td><td></td><td></td><td></td></tr>
        <tr><td></td><td>THIS</td><td></td><td></td><td></td></tr>
        <tr><td></td><td>THIS</td><td></td><td></td><td></td></tr>
        <tr><td></td><td>THIS</td><td></td><td></td><td></td></tr>
    </tbody>
</table>