jQuery ที่ใกล้เคียงที่สุด ()วิธีการ

❮ วิธีการข้ามผ่าน jQuery

ตัวอย่าง

ส่งกลับบรรพบุรุษแรกของ <span> นั่นคือ <ul> องค์ประกอบ:

$(document).ready(function(){
  $("span").closest("ul").css({"color": "red", "border": "2px solid red"});
});

ผลลัพธ์:

body (great-great-grandparent)
div (great-grandparent)
    ul (second ancestor - second grandparent)
      ul (first ancestor - first grandparent)
    • li (direct parent)  span  
     

ความหมายและการใช้งาน

วิธีที่ใกล้เคียงที่สุด () วิธีการส่งกลับบรรพบุรุษแรกขององค์ประกอบที่เลือก

บรรพบุรุษคือพ่อแม่ปู่ย่าตายายปู่ย่าตายายเป็นต้น

แผนผัง DOM:วิธีการนี้จะข้ามขึ้นไปจากองค์ประกอบปัจจุบัน ไปจนถึงองค์ประกอบรากของเอกสาร (<html>) เพื่อค้นหาบรรพบุรุษแรกขององค์ประกอบ DOM

วิธีนี้คล้ายกับparent()โดยที่ทั้งคู่ข้ามต้นไม้ DOM ความแตกต่างมีดังนี้:

ใกล้เคียงที่สุด()

  • เริ่มต้นด้วยองค์ประกอบปัจจุบัน
  • เดินทางขึ้นต้นไม้ DOM และส่งคืนบรรพบุรุษ (เดี่ยว) แรกที่ตรงกับนิพจน์ที่ส่งผ่าน
  • วัตถุ jQuery ที่ส่งคืนมีศูนย์หรือหนึ่งองค์ประกอบ

ผู้ปกครอง()

  • เริ่มต้นด้วยองค์ประกอบหลัก
  • เดินทางขึ้นต้นไม้ DOM และส่งคืนบรรพบุรุษทั้งหมดที่ตรงกับนิพจน์ที่ส่งผ่าน
  • วัตถุ jQuery ที่ส่งคืนมีศูนย์หรือมากกว่าหนึ่งองค์ประกอบ

วิธีการที่เกี่ยวข้องอื่นๆ:

  • parent() - ส่งคืนองค์ประกอบหลักโดยตรงขององค์ประกอบที่เลือก
  • parentUntil() - ส่งคืนองค์ประกอบบรรพบุรุษทั้งหมดระหว่างสองอาร์กิวเมนต์ที่กำหนด


ไวยากรณ์

ส่งคืนบรรพบุรุษแรกขององค์ประกอบที่เลือก:

$(selector).closest(filter)

ส่งคืนบรรพบุรุษแรกโดยใช้บริบท DOM เพื่อค้นหาแผนผัง DOM ภายใน:

$(selector).closest(filter,context)

Parameter Description
filter Required. Specifies a selector expression, element or jQuery object to narrow down the ancestor search
context Optional. A DOM element within which a matching element may be found

ลองด้วยตัวคุณเอง - ตัวอย่าง


เนื่องจากวิธีนี้เริ่มต้นด้วยองค์ประกอบปัจจุบัน การค้นหา <span> แรกของ <span> จะส่งกลับ <span>


ใช้พารามิเตอร์ทั้งสองเพื่อส่งผ่านในองค์ประกอบ DOM เป็นบริบทภายในเพื่อค้นหาองค์ประกอบ <ul> แรก


❮ วิธีการข้ามผ่าน jQuery