jQuery mỗi vòng lặp trong dòng của bảng

Question

thể trùng lặp:
How to iterate a table rows with JQuery and access some cell values?

Tôi gặp một cái gì đó như:

<table id="tblOne"> 
      <tbody> 
       <tr> 
        <td> 
         <table id="tblTwo"> 
          <tbody> 
           <tr> 
            <td> 
             Items 
            </td> 
           </tr> 
           <tr> 
            <td> 
             Prod 
            </td> 
           </tr> 
          </tbody> 
         </table> 
        </td> 
       </tr> 
       <tr> 
        <td> 
         Item 1 
        </td> 
       </tr> 
       <tr> 
        <td> 
         Item 2 
        </td> 
       </tr> 
      </tbody> 
     </table> 

Tôi đã viết jQuery để lặp qua từng tr như :

$('#tblOne tr').each(function() {...code...}); 

Nhưng vấn đề là nó lặp qua "tr" của "tblTwo" mà tôi cũng không muốn. Có ai vui lòng đề xuất điều gì đó để giải quyết vấn đề này không?

Answer 1

trong jQuery chỉ cần sử dụng

$('#tblOne > tbody > tr').each(function() {...code...}); 

sử dụng trẻ em chọn trực tiếp (>), bạn sẽ đi qua hậu duệ trực tiếp (và không tất cả hậu duệ)

---

trong VanillaJS bạn có thể sử dụng document.querySelectorAll() và đi bộ qua các hàng bằng cách sử dụng forEach()

[].forEach.call(document.querySelectorAll('#tblOne > tbody > tr'), function(tr) { 
    /* console.log(tr); */ 
}); 

Answer 2

Sử dụng immediate children selector>:

$('#tblOne > tbody > tr') 

Mô tả: Chọn tất cả phần tử con trực tiếp định bởi "con" của yếu tố theo quy định của "cha mẹ".

Answer 3

Chỉ cần một đề nghị:

tôi khuyên bạn nên sử dụng thực hiện bảng DOM, nó rất thẳng về phía trước và dễ dàng để sử dụng, bạn thực sự không cần jQuery cho nhiệm vụ này.

var table = document.getElementById('tblOne'); 

var rowLength = table.rows.length; 

for(var i=0; i<rowLength; i+=1){ 
    var row = table.rows[i]; 

    //your code goes here, looping over every row. 
    //cells are accessed as easy 

    var cellLength = row.cells.length; 
    for(var y=0; y<cellLength; y+=1){ 
    var cell = row.cells[y]; 

    //do something with every cell here 
    } 
}