ตัวอย่าง
กลับองค์ประกอบทั้งหมดของบรรพบุรุษ <span> :
$(document).ready(function(){
$("span").parents().css({"color":
"red", "border": "2px solid red"});
});
ผล:
body (great-great-grandparent)
div (great-grandparent)
ul (grandparent)
- li (direct parent)
span
ลองตัวเอง» ความหมายและการใช้งาน
parents() วิธีการส่งกลับองค์ประกอบบรรพบุรุษทั้งหมดขององค์ประกอบที่เลือก
บรรพบุรุษเป็นพ่อแม่ปู่ย่าตายายปู่ย่าตายายที่ดีและอื่น ๆ
ต้นไม้ DOM: วิธีการนี้สำรวจขึ้นมาจากองค์ประกอบหลักตามบรรพบุรุษขององค์ประกอบ DOM ทั้งหมดทางขึ้นไปยังองค์ประกอบรากของเอกสาร (<html>)
หมายเหตุ: หากพารามิเตอร์ตัวกรองเป็นที่ว่างเปล่า, ฟังก์ชั่นนี้จะเลือกบรรพบุรุษทุกชุดขององค์ประกอบจากผู้ปกครองโดยตรงและทุกทางขึ้นไปยัง <body> และ <html> ดังนั้นจึงเป็นเรื่องที่มีประโยชน์มักจะผ่านการแสดงออกเลือกให้แคบลงผลการค้นหา
วิธีการนี้จะคล้ายกับ closest() ในการที่พวกเขาทั้งสองสำรวจขึ้นต้นไม้ DOM ความแตกต่างที่มีรายละเอียดดังนี้
parents()
- เริ่มต้นด้วยองค์ประกอบหลัก
- เดินทางขึ้นไปบนต้นไม้ DOM และส่งกลับบรรพบุรุษทั้งหมดที่ตรงกับการแสดงออกผ่าน
- วัตถุ jQuery กลับมีศูนย์หรือมากกว่าหนึ่งองค์ประกอบ
closest()
- เริ่มต้นด้วยองค์ประกอบปัจจุบัน
- เดินทางขึ้นไปบนต้นไม้ DOM และส่งกลับบรรพบุรุษแรกที่ตรงกับการแสดงออกผ่าน
- วัตถุ jQuery กลับมีศูนย์หรือองค์ประกอบหนึ่ง
วิธีการอื่น ๆ ที่เกี่ยวข้อง:
- parent() - ส่งกลับองค์ประกอบหลักโดยตรงขององค์ประกอบที่เลือก
- parentsUntil() - ส่งกลับองค์ประกอบบรรพบุรุษทั้งหมดระหว่างสองอาร์กิวเมนต์ที่กำหนด
วากยสัมพันธ์
$(selector).parents( filter )| พารามิเตอร์ | ลักษณะ |
|---|---|
| class = "notranslate"ตัวกรอง | ไม่จำเป็น ระบุการแสดงออกเลือกที่จะแคบลงการค้นหาบรรพบุรุษ หมายเหตุ: หากต้องการกลับบรรพบุรุษหลายแยกแต่ละแสดงออกด้วยเครื่องหมายจุลภาค |
ลองตัวเอง - ตัวอย่าง
ค้นหาแคบลง
วิธีการใช้พารามิเตอร์ตัวกรองที่จะกลับบรรพบุรุษทั้งหมดของ <span> ที่ <ul> องค์ประกอบ
กลับบรรพบุรุษหลาย
วิธีการใช้พารามิเตอร์ตัวกรองที่จะกลับบรรพบุรุษทั้งหมดของ <span> ที่ <li> และ <div> องค์ประกอบ
แสดงบรรพบุรุษขององค์ประกอบโดยชื่อแท็ก
การสาธิตซึ่งแสดงให้เห็นที่บรรพบุรุษของที่ <span> องค์ประกอบที่เป็นจริง