jQuery วิธีเดินทาง

อะไรคือการเดินทาง?

jQuery การเดินทาง หมายถึง “การเดินทาง” ใช้เพื่อ “ค้นหา” (หรือเลือก) องค์ประกอบสื่อสาร HTML ตามความสัมพันธ์กับองค์ประกอบสื่อสารอื่นๆ จากความเลือกเริ่มต้น และเดินทางตามความเลือกจนถึงองค์ประกอบสื่อสารที่คุณต้องการ

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

การชี้แจงรูปภาพ:

เดินทางผ่านต้นไม้ DOM
  • องค์ประกอบสื่อสาร <div> เป็นพ่อของ <ul> และเป็นบิดาของทุกสิ่งที่มีในใน
  • องค์ประกอบสื่อสาร <ul> เป็นพ่อขององค์ประกอบสื่อสาร <li> และเป็นลูกของ <div>
  • องค์ประกอบสื่อสาร <li> ด้านซ้าย เป็นพ่อของ <span> ลูกของ <ul> และเป็นทายาทของ <div>
  • องค์ประกอบสื่อสาร <span> เป็นลูกของ <li> และเป็นทายาทของ <ul> และ <div>
  • องค์ประกอบสื่อสาร <li> สององค์ประกอบสื่อสารเป็นพี่น้อง (มีพ่อเดียวกัน)
  • องค์ประกอบสื่อสาร <li> ด้านขวา เป็นพ่อของ <b> ลูกของ <ul> และเป็นทายาทของ <div>
  • <b> องค์ประกอบสื่อสาร </b> เป็นลูกของ <li> ด้านขวา และเป็นทายาทของ <ul> และ <div>

คำเตือน:บิดาคือพ่อ ปู่ ปู่ทายาท และอื่นๆ หลายๆ ทายาทคือลูก หลาน หลานทายาท และอื่นๆ พี่น้องมีพ่อเดียวกัน

การเดินทาง DOM

jQuery มีวิธีการเดินทาง DOM หลากหลาย

หนึ่งในหมวดหมู่ที่ใหญ่ที่สุดของวิธีการเดินทางคือ การเดินทางต้นไม้ (tree-traversal)。

บทที่ต่อไปจะเรียนการเดินทางขึ้นไปและลงมา และเดินทางระดับเดียวกันในต้นไม้ DOM。

คู่มือเรียนรู้ jQuery การเดินทาง

หากต้องการรู้จักทุกวิธีการเดินทาง jQuery โปรดเข้าชม คู่มือเรียนรู้ jQuery การเดินทาง