การตำหนิตัวเลือก XML DOM

สามารถที่จะหาตัวเลือกด้วยความสัมพันธ์ระหว่างตัวเลือก

ตัวอย่าง

ตัวอย่างด้านล่างใช้ไฟล์ XML books.xml

ฟังก์ชัน loadXMLDoc()ที่ตั้งอยู่ใน JavaScript ด้านนอก ใช้เพื่อโหลดไฟล์ XML

เรียกหาตัวเลือกหลังของตัวเลือก
ตัวอย่างนี้ใช้คุณสมบัติ parentNode ที่สร้างขึ้นเพื่อหาตัวองค์พ่อของตัวองค์
หาตัวองค์ลูกแรกของตัวองค์
ตัวอย่างนี้ใช้วิธี firstChild() และฟังก์ชันที่สร้างขึ้นเองเพื่อหาตัวองค์ลูกแรกของตัวองค์

การเดินทาง DOM ตัวองค์

การเข้าถึงตัวองค์ในโครงสร้างตัวองค์ผ่านความสัมพันธ์ระหว่างตัวองค์ ทั่วไปจะเรียกว่า การเดินทางตัวองค์ ("navigating nodes")

ใน XML DOM ความสัมพันธ์ระหว่างตัวองค์ถูกกำหนดโดยคุณสมบัติของตัวองค์

  • parentNode
  • childNodes
  • firstChild
  • lastChild
  • nextSibling
  • previousSibling

ภาพที่แสดงด้านล่างแสดง books.xml ส่วนหนึ่งของต้นไม้โครงสร้างของ DOM และอธิบายความสัมพันธ์ระหว่างตัวองค์

โหลดโต๊ะโนดห์

DOM - ตัวองค์พ่อ

ตัวองค์ทุกตัวมีตัวองค์พ่อเพียงตัวเดียว รหัสที่แสดงด้านล่างจะใช้เพื่อหาตัวองค์พ่อของ <book>

xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("book")[0];
document.write(x.parentNode.nodeName);

ตัวอย่างการอธิบาย:

  • ด้วยการใช้ loadXMLDoc() ใส่ "books.xml" โหลดเข้า xmlDoc"
  • เรียกใช้ element <book> แรก
  • แสดงชื่อตัวองค์ของตัวองค์พ่อของ "x"

TIY

ป้องกันตัวองค์ข้อความเปล่า

Firefox และบราวเซอร์อื่นๆ จะถือว่าช่องว่างหรือทางเชื่อมเป็นตัวองค์ข้อความ ในขณะที่ IE จะไม่ทำตาม

นี่จะเกิดปัญหาเมื่อใช้ของคุณสมบัติต่อไปนี้: firstChild, lastChild, nextSibling, previousSibling

เพื่อป้องกันจากการตรวจสอบตัวองค์ของข้อความเปล่า (ช่องว่างหรือทางเชื่อมระหว่างตัวองค์ element) เราใช้ฟังก์ชันเพื่อตรวจสอบประเภทของตัวองค์

function get_nextSibling(n)
{
y=n.nextSibling;
while (y.nodeType!=1)
  {
  y=y.nextSibling;
  }
return y;
}

ด้วยฟังก์ชันที่กล่าวข้างต้น เราสามารถใช้ get_nextSibling(node) แทนคุณสมบัติ node.nextSibling

การอธิบายรหัส

ประเภทของตัวองค์ element คือ 1 ถ้าตัวองค์รุ่นเดียวกันไม่ใช่ element node ก็เคลื่อนย้ายไปยังตัวองค์ต่อไปจนหาตัวองค์ element โดยใช้วิธีนี้ ใน IE และ Firefox จะได้ผลลัพธ์เดียวกัน

เรียกใช้ element แรก

รหัสที่แสดงด้านล่างแสดงความเห็นสำหรับตัวองค์แรกของ <book> ซึ่งเป็น element node

<html>
<head>
<script type="text/javascript" src="loadxmldoc.js">
</script>
<script type="text/javascript">
//ตรวจสอบว่าตัวองค์แรกเป็นตัวองค์ที่เป็น element node
function get_firstChild(n)
{
y=n.firstChild;
while (y.nodeType!=1)
  {
  y=y.nextSibling;
  }
return y;
}
</script>
</head>
<body>
<script type="text/javascript">
xmlDoc=loadXMLDoc("books.xml");
x=get_firstChild(xmlDoc.getElementsByTagName("book")[0]);
document.write(x.nodeName);
</script>
</body>
</html>

แสดง:

title

ตัวอย่างการอธิบาย:

  • ด้วยการใช้ loadXMLDoc() ใส่ "books.xml" โหลด xmlDoc ใน
  • ใช้ฟังก์ชัน get_firstChild บน <book> แรกเพื่อเรียกนามของโครงสร้างลูกที่มีอยู่ในโครงสร้างเจ้า
  • แสดงชื่อโครงสร้างของโครงสร้างลูก (เป็นตัวเลข) ของโครงสร้างเจ้า

TIY

ตัวอย่าง

ตัวอย่างด้านล่างใช้ฟังก์ชันที่คล้ายกัน:

  • firstChild: TIY
  • lastChild: TIY
  • nextSibling: TIY
  • previousSibling: TIY