วิธีรับเฉพาะองค์ประกอบลูกโดยตรงโดยฟังก์ชัน jQuery

ฉันมีโครงสร้างตารางดังนี้:

<table1>
  <tbody>
    <tr>
      <td></td>
        ...
      <td>
        <table2>
          <tbody>
            <tr>
              <td></td>
            </tr>
          </tbody>
        </table>
      </td>
    </tr>
   </tbody>
  </table>

ใน javascript ฉันมีตัวแปรที่tblมีค่าจาก$(table1)นั้นฉันต้องการรับองค์ประกอบลูกโดยตรงทั้งหมด (tr) <tbody>ของtable1. รหัสของฉันคือ:

$('tr', tb1)

เห็นได้ชัดว่ามันส่งคืน<tr>องค์ประกอบทั้งหมดใน table1 และ table2 ฉันคิดว่าฉันสามารถผ่านไปได้

$('tr', tb1).not(function(){return $(this).parent().parent()[0] != tb1;})

หรือตรรกะแบบนี้

ฉันรู้ว่าจะได้รับเด็กโดยตรง$('table1 > tbody > tr') trน่าเสียดายที่ฉันไม่สามารถใช้สิ่งนี้ได้

ใครมีความคิดที่ดีเกี่ยวกับเรื่องนี้?

ขอบคุณ.

คุณสามารถใช้find():

tbl.find("> tbody > tr")

ตามที่ @ jave.web กล่าวไว้ในความคิดเห็น

.children()การค้นหาผ่านเด็กโดยตรงของการใช้องค์ประกอบ มันจะค้นหาเฉพาะเด็กโดยตรงและไม่สำรวจลึกลงไป http://api.jquery.com/children/

นี่คือเหตุผลที่ว่าทำไมเราจึงควรระวังตารางซ้อนกัน ฉันหวังเป็นอย่างยิ่งว่าคุณจะใช้ข้อมูลเหล่านี้เพื่อเป็นข้อมูลไม่ใช่เค้าโครงหน้า

อีกปัญหาหนึ่งที่อาจทำลายวันของคุณคือการใช้ตัวเลือก CSS บนตารางที่ซ้อนกัน ... โดยพื้นฐานแล้วคุณมีปัญหาเดียวกัน - คุณไม่สามารถเลือกองค์ประกอบ TR ของตารางด้านนอกได้โดยไม่ต้องเลือกองค์ประกอบภายในตารางด้านในด้วย (คุณไม่สามารถใช้ตัวเลือกลูกได้เนื่องจากไม่มีการนำไปใช้ใน IE6)

สิ่งนี้ควรใช้งานได้:

$("#table1 > tbody > tr")

อย่างไรก็ตามขอแนะนำให้คุณฮาร์ดโค้ดองค์ประกอบ TBODY เนื่องจากคุณไม่ควรพึ่งพาเบราว์เซอร์ในการสร้างให้คุณ

http://api.jquery.com/child-selector/

$('tb1 > tr')

หากคุณมีรหัสของทั้งสององค์ประกอบและต้องการค้นหาการใช้องค์ประกอบโดยตรงด้านล่างโค้ด

$("#parent > #two")

หากคุณต้องการค้นหาแบบซ้อนคุณสามารถใช้ find มีการอธิบายรายละเอียดที่นี่ https://handyopinion.com/jquery-selector-find-nested-child-elements/