Duyệt qua cột thứ hai trong một bảng trong jQuery

Question

Tôi có bảng trong dom trông như thế này

<div id="table"> 
<table> 
<tr> 
    <td>a</td> 
    <td>b</td> 
    <td>c</td> 
    <td>d</td> 
</tr> 
<tr> 
    <td>a</td> 
    <td>b</td> 
    <td>c</td> 
    <td>d</td> 
</tr> 
</div> 

Tôi muốn lặp thông qua bảng này, chẳng hạn như $('#table').each(function(){}) nhưng tôi chỉ muốn lặp qua cột thứ hai . Vì vậy, những cái mà trong ví dụ này có giá trị b.

Bất kỳ ý tưởng nào về cách thực hiện việc này?

Cảm ơn bạn!

Answer 1

Hãy thử điều này:

$("table tr td:nth-child(2)").each(function() { 

}); 

Answer 2

Sử dụng nth-child chọn trong jQuery, điều này sẽ làm việc:

$("#table").find("td:nth-child(2)").each(function() { 

}); 

này sử dụng nth-child selector, http://api.jquery.com/nth-child-selector/, mà như các quốc gia liên kết, sẽ chọn tất cả <td> yếu tố đó là con thứ 2 của cha mẹ (sẽ là <tr>).

Dưới đây là một fiddle đó chứng tỏ nó: http://jsfiddle.net/GshRz/

Nếu bạn đang tìm kiếm một selector mà được các <td> s mà chỉ ngay trong bảng (như không trong một bảng lồng nhau), sau đó sử dụng một cái gì đó như:

$("#table").children("tbody").children("tr").children("td:nth-child(2)").each(function() { 

}); 

http://jsfiddle.net/GshRz/1/

Tùy thuộc vào cấu trúc của bạn (nơi bạn có thể bao gồm một <thead>), bạn có thể sử dụng .children("thead, tbody") thay vì chỉ .children("tbody").

Ngoài ra, trong trường hợp bạn muốn lấy một số cột, có thể dễ dàng chọn các phần tử <tr> và sau đó lấy các phần tử con <td>. Ví dụ:

$("#table1").children("tbody").children("tr").each(function (i) { 
    var $this = $(this); 
    var my_td = $this.children("td"); 
    var second_col = my_td.eq(1); 
    var third_col = my_td.eq(2); 
    console.log("Second Column Value (row " + i + "): " + second_col.html()); 
    console.log("Third Column Value (row " + i + "): " + third_col.html()); 
}); 

http://jsfiddle.net/GshRz/2/

gì selectors bạn sử dụng và ở đâu, tùy thuộc vào cấu trúc và nội dung của bảng. Vì vậy, hãy nhớ phân biệt giữa children và find và nth-child và eq.

Answer 3

$("#table td:nth-child(2)").each(function (index) { 
    alert('Row no. ' + (index+1) + ', Column 2 : ' + $(this).html()); 
}); 

Sample