XML DOM - လမ်းကြောင်းပြခြင်း Nodes
Node များကို node ဆက်ဆံရေးများကို အသုံးပြု၍ လမ်းညွှန်နိုင်သည်။
DOM Nodes များကို လမ်းညွှန်ခြင်း။
node များကြား ဆက်စပ်မှုမှတစ်ဆင့် node tree ရှိ node များကို ဝင်ရောက်ကြည့်ရှုခြင်းကို "navigating nodes" ဟုခေါ်သည်။
XML DOM တွင် node ဆက်ဆံရေးများကို node များအတွက် ဂုဏ်သတ္တိများအဖြစ် သတ်မှတ်သည်-
- parentNode
- ကလေးNodes
- ပထမကလေး
- နောက်ဆုံးကလေး
- မွေးချင်း
- ညီအကို
အောက်ပါပုံသည် node tree ၏ အစိတ်အပိုင်းတစ်ခုနှင့် books.xml ရှိ node များကြား ဆက်စပ်မှုကို သရုပ်ဖော်သည် ။
DOM - Parent Node
node အားလုံးတွင် parent node အတိအကျရှိသည်။ အောက်ဖော်ပြပါ ကုဒ်သည် <book> ၏ ပင်မဆုံမှတ်သို့ သွားသည်-
ဥပမာ
function myFunction(xml) {
var xmlDoc = xml.responseXML;
var x = xmlDoc.getElementsByTagName("book")[0];
document.getElementById("demo").innerHTML = x.parentNode.nodeName;
}
ဥပမာ ရှင်းပြထားသည်
- " books.xml " ကို xmlDoc ထဲသို့ ထည့်ပါ။
- ပထမဆုံး <book> ဒြပ်စင်ကို ရယူပါ။
- "x" ၏ parent node ၏ node အမည်ကို ထုတ်ပါ။
Empty Text Nodes ကိုရှောင်ပါ။
Firefox နှင့် အခြားဘရောက်ဆာအချို့သည် ကွက်လပ်အဖြူကွက်များ သို့မဟုတ် စာကြောင်းအသစ်များကို စာသား node များအဖြစ် ဆက်ဆံမည်ဖြစ်သော်လည်း Internet Explorer တွင် ရှိမည်မဟုတ်ပါ။
၎င်းသည် ဂုဏ်သတ္တိများ- firstChild၊ LastChild၊ nextSibling၊ PreviousSibling ကိုအသုံးပြုသောအခါ ပြဿနာဖြစ်စေသည်။
အချည်းနှီးသော စာသား nodeများသို့ သွားလာခြင်းမှ ရှောင်ကြဉ်ရန် (ဒြပ်စင်များကြားတွင် နေရာလွတ်များနှင့် လိုင်းအသစ်အက္ခရာများ)၊ node အမျိုးအစားကို စစ်ဆေးသည့် လုပ်ဆောင်ချက်ကို အသုံးပြုသည်-
function get_nextSibling(n)
{
var y = n.nextSibling;
while (y.nodeType! = 1)
{
y = y.nextSibling;
}
return y;
}
အထက်ဖော်ပြပါလုပ်ဆောင်ချက်သည် သင့်အား ပိုင်ဆိုင်မှု node အစား get_nextSibling( node ) ကို အသုံးပြုရန် ခွင့်ပြုသည် ။nextSibling
ကုဒ်ကို ရှင်းပြထားသည်-
Element node များသည် အမျိုးအစား 1 ဖြစ်သည်။ sibling node သည် element node မဟုတ်ပါက၊ element node ကိုမတွေ့မချင်း ၎င်းသည် နောက် node များသို့ ရွေ့လျားသည်။ ဤနည်းဖြင့် ရလဒ်သည် Internet Explorer နှင့် Firefox နှစ်ခုလုံးတွင် တူညီမည်ဖြစ်သည်။
ပထမဆုံး ကလေးဒြပ်စင်ကို ရယူပါ။
အောက်ပါကုဒ်သည် ပထမ <book> ၏ ပထမဒြပ်စင်ကို ပြသသည်-
ဥပမာ
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
myFunction(this);
}
};
xhttp.open("GET",
"books.xml", true);
xhttp.send();
function myFunction(xml) {
var xmlDoc = xml.responseXML;
var x = get_firstChild(xmlDoc.getElementsByTagName("book")[0]);
document.getElementById("demo").innerHTML = x.nodeName;
}
//check if
the first node is an element node
function get_firstChild(n) {
var y = n.firstChild;
while (y.nodeType != 1) {
y = y.nextSibling;
}
return y;
}
</script>
</body>
</html>
အထွက်-
title
ဥပမာ ရှင်းပြထားသည်
- " books.xml " ကို xmlDoc ထဲသို့ ထည့်ပါ။
- get_firstChild လုပ်ဆောင်ချက်ကို ပထမဆုံး <book> ဒြပ်စင် Node တွင် အသုံးပြုပါ
- Element Node တစ်ခုဖြစ်သည့် ပထမကလေး node ၏ node အမည်ကို ထုတ်ပေးပါ။
နောက်ထပ် ဥပမာများ
ဤဥပမာသည် node တစ်ခု၏ နောက်ဆုံးကလေး node ကိုရယူရန် lastChild() နည်းလမ်းနှင့် စိတ်ကြိုက်လုပ်ဆောင်ချက်ကို အသုံးပြုသည်
ဤနမူနာသည် node တစ်ခု၏နောက်ထပ် sibling node ကိုရရှိရန် nextSibling() method နှင့် custom function ကိုအသုံးပြုသည်
ဤဥပမာသည် node တစ်ခု၏ယခင် sibling node ကိုရရှိရန် ယခင်Sibling() နည်းလမ်းနှင့် စိတ်ကြိုက်လုပ်ဆောင်ချက်ကို အသုံးပြုသည်