ล่าสุดการพัฒนาเว็บบทเรียน
 

jQueryภายใน - พี่น้อง

❮ก่อนหน้า ถัดไปบท❯

พี่น้องร่วมแม่เดียวกัน

กับ jQuery คุณสามารถสำรวจข้างในต้นไม้ DOM เพื่อหาพี่น้องขององค์ประกอบ

ภายใน Sideways ในโครงสร้างต้นไม้ DOM

มีวิธีการ jQuery ที่มีประโยชน์มากมายสำหรับ traversing ข้างในต้นไม้ DOM คือ:

  • siblings()
  • next()
  • nextAll()
  • nextUntil()
  • prev()
  • prevAll()
  • prevUntil()

jQuery siblings() วิธี

siblings() วิธีการส่งกลับองค์ประกอบพี่น้องทั้งหมดขององค์ประกอบที่เลือก

ตัวอย่างต่อไปนี้จะส่งกลับองค์ประกอบทั้งหมดของพี่น้อง <h2> :

ตัวอย่าง

$(document).ready(function(){
    $("h2").siblings();
});
ลองตัวเอง»

นอกจากนี้คุณยังสามารถใช้พารามิเตอร์ตัวกรองการค้นหาสำหรับพี่น้อง

ตัวอย่างต่อไปนี้จะส่งกลับองค์ประกอบทั้งหมดของพี่น้อง <h2> ที่ <p> องค์ประกอบ:

ตัวอย่าง

$(document).ready(function(){
    $("h2").siblings("p");
});
ลองตัวเอง»

jQuery next() วิธี

next() วิธีการส่งกลับองค์ประกอบพี่น้องต่อไปขององค์ประกอบที่เลือก

ตัวอย่างต่อไปนี้จะส่งกลับต่อไปของพี่น้อง <h2> :

ตัวอย่าง

$(document).ready(function(){
    $("h2").next();
});
ลองตัวเอง»

jQuery nextAll() วิธี

nextAll() วิธีการส่งกลับองค์ประกอบพี่น้องทุกคนต่อไปขององค์ประกอบที่เลือก

ตัวอย่างต่อไปนี้จะส่งกลับองค์ประกอบต่อไปพี่น้องทั้งหมดของ <h2> :

ตัวอย่าง

$(document).ready(function(){
    $("h2").nextAll();
});
ลองตัวเอง»

jQuery nextUntil() วิธี

nextUntil() วิธีการส่งกลับองค์ประกอบต่อไปพี่น้องทั้งหมดระหว่างสองอาร์กิวเมนต์ที่กำหนด

ตัวอย่างต่อไปนี้จะส่งกลับองค์ประกอบพี่น้องทั้งหมดระหว่าง <h2> และ <h6> องค์ประกอบ:

ตัวอย่าง

$(document).ready(function(){
    $("h2").nextUntil("h6");
});
ลองตัวเอง»

jQuery prev(), prevAll() & prevUntil() วิธีการ

prev(), prevAll() และ prevUntil() วิธีการทำงานเช่นเดียวกับวิธีการดังกล่าวข้างต้น แต่มีการทำงานย้อนกลับ: พวกเขากลับองค์ประกอบพี่น้องก่อนหน้า (สำรวจย้อนหลังพร้อมองค์ประกอบพี่น้องในต้นไม้ DOM แทนที่จะไปข้างหน้า)

ทดสอบด้วยตัวเองด้วยการออกกำลังกาย!

การใช้สิทธิ 1 » ออกกำลังกาย 2 » ออกกำลังกาย 3 » 4 การออกกำลังกาย» ออกกำลังกาย 5 » ออกกำลังกาย 6 »

jQuery traversing อ้างอิง

สำหรับภาพรวมทั้งหมดของทุกวิธีการ jQuery traversing โปรดไปที่เรา jQuery traversing อ้างอิง


❮ก่อนหน้า ถัดไปบท❯