XML DOM คุณสมบัติแรกสำหรับเด็ก
❮ วัตถุธาตุ
ตัวอย่าง
โค้ดย่อยต่อไปนี้โหลด " books.xml " ลงใน xmlDoc และรับโหนดชายน์แรก:
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
myFunction(this);
}
};
xhttp.open("GET", "books.xml", true);
xhttp.send();
//
Check if the first node is an element node
function get_firstchild(n) {
var x = n.firstChild;
while (x.nodeType != 1) {
x = x.nextSibling;
}
return x;
}
function myFunction(xml) {
var x, i, txt, firstNode, xmlDoc;
xmlDoc = xml.responseXML;
x = xmlDoc.documentElement;
txt = "";
firstNode = get_firstchild(x);
for (i = 0; i < firstNode.childNodes.length; i++) {
if (firstNode.childNodes[i].nodeType == 1) {
//Process only element nodes
txt += firstNode.childNodes[i].nodeName +
" = " +
firstNode.childNodes[i].childNodes[0].nodeValue + "<br>";
}
}
document.getElementById("demo").innerHTML
= txt;
}
ผลลัพธ์ของโค้ดด้านบนจะเป็น:
title = Everyday Italian
author = Giada De Laurentiis
year = 2005
price = 30.00
ความหมายและการใช้งาน
คุณสมบัติ firstChild ส่งคืนโหนดย่อยแรกขององค์ประกอบที่เลือก
ถ้าโหนดที่เลือกไม่มีชายด์ คุณสมบัตินี้จะคืนค่า NULL
ไวยากรณ์
elementNode.firstChild
เคล็ดลับและหมายเหตุ
หมายเหตุ: Firefox และเบราว์เซอร์อื่นๆ ส่วนใหญ่จะถือว่าช่องว่างสีขาวหรือบรรทัดใหม่เป็นโหนดข้อความ แต่ Internet Explorer จะไม่ดำเนินการ ในตัวอย่างด้านล่าง เรามีฟังก์ชันที่ตรวจสอบประเภทโหนดของโหนดย่อยแรก
โหนดองค์ประกอบมีโหนดประเภท 1 ดังนั้นหากโหนดย่อยแรกไม่ใช่โหนดองค์ประกอบ โหนดจะย้ายไปยังโหนดถัดไป และตรวจสอบว่าโหนดนี้เป็นโหนดองค์ประกอบหรือไม่ สิ่งนี้จะดำเนินต่อไปจนกว่าจะพบโหนดย่อยแรก (ซึ่งจะต้องเป็นโหนดองค์ประกอบ) ด้วยวิธีนี้ ผลลัพธ์จะถูกต้องในทุกเบราว์เซอร์
เคล็ดลับ:หากต้องการอ่านเพิ่มเติมเกี่ยวกับความแตกต่างระหว่างเบราว์เซอร์ โปรดไป ที่บท เบราว์เซอร์ DOM ของ เราในบทช่วยสอน XML DOM
❮ วัตถุธาตุ