jquery在tbody元素

时间:2016-08-10 20:01:23

标签: javascript jquery html angularjs jquery-selectors

var html_table =
    "<table class='table'>" +
    "<thead>" +
    "<tr><th>#</th><th>First</th><th>Second</th><th>Third</th><th>Fourth</th><th>Fifth</th></tr></thead>" +
    "<tbody>" +
    "<tr><td ></td><td></td><td>Pitt</td><td>35</td><td>New York</td><td>USA</td></tr>" +
    "</tbody>" +
    "</table>";

var $html_table = $(html_table);
var first_column= $html_table.find('???');
var second_column= $html_table.find('???');

所以我在javascript中有上面的表,并使用jquery来获取第一列和第三列。但是find()方法似乎不够灵活,无法获得tbody元素中的第一和第三列

4 个答案:

答案 0 :(得分:1)

我们说你的桌子有id="table"。你可以这样做:

var first_column = $('#table:first-child');
var second_column = $('#table:nth-child(2)');

我还没试过这个,但它应该有效。随意使用css3选择器来获得他们所有的辉煌。

答案 1 :(得分:1)

您可以使用.eq函数获取列。

$html_table.find('tbody tr td').eq(0) // First element
$html_table.find('tbody tr td').eq(2) // third element

在eq函数中,使用以0开头的索引。

答案 2 :(得分:1)

您可以使用下一个代码访问所有td列:

var columnNumber = 0; //first column
$.each($html_table.find("tr"), function(){
  var tdOfCurrentColumn = $(this).children().eq(columnNumber);
})

答案 3 :(得分:0)

来自Chris,我认为使用CSS3选择器会更容易。

var first_column= $("tbody td:nth-child(1)",$html_table)
var second_column=  $("tbody td:nth-child(2)",$html_table)

检查一下。 https://jsfiddle.net/nvg4f2at/1/