XML DOM Locate Nodes

maaaring mapalibutan ang mga node sa pamamagitan ng relasyon ng mga node.

实例

Ang mga halimbawa sa ibaba ay gumagamit ng file na XML books.xml.

Function loadXMLDoc()na matatagpuan sa labas na JavaScript, na ginagamit para sa paglalagay ng file na XML.

Nakuha ang magulang na node ng isang node
Ang halimbawa na ito ay gumagamit ng attribute na parentNode upang hanapin ang parent node ng isang node.
Hanapin ang unang anak ng isang node
Ang halimbawa na ito ay gumagamit ng method na firstChild() at isang custom function upang hanapin ang unang anak ng isang node.

Navigating DOM Nodes

Makakapasok sa mga node sa puno ng node sa pamamagitan ng relasyon ng mga node, na kilala bilang pagnavigasyon ng mga node ("navigating nodes").

Sa XML DOM, ang mga relasyon ng mga node ay tinatawag na attribute ng mga node:

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

Ang sumusunod na imahe ay nagpapakita ng: books.xml Ito ay isang bahagi ng puno ng node, at ipinapaliwanag ang mga relasyon ng mga node:

DOM node tree

DOM - Parent Node

Ang lahat ng node ay may isang parent node lamang. Ang sumusunod na kodigo ay nasa lokasyon ng parent node ng <book>:

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

例子解释:

  • 通过使用 loadXMLDoc() 把 "books.xml" ay inilalagay sa xmlDoc
  • Hanapin ang unang <book> element
  • Magpalabas ng pangalan ng parent node ng "x"

TIY

Iwasan ang walang laman na text node

Ang Firefox, at ibang mga browser, ay inaangkin ang walang laman na puti o paglilinaw bilang text node, habang ang IE ay hindi.

Ito ay magiging problema kapag ginagamit ang mga sumusunod na attribute: firstChild, lastChild, nextSibling, previousSibling.

Upang maiwasan ang pag-locate sa walang laman na text node (spasyal na simbolo sa pagitan ng mga element node at mga simbolo ng paglilinaw), gumagamit kami ng isang function upang suriin ang uri ng node:

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

Mayroon nang function, sa gayon maaari naming gamitin ang get_nextSibling(node) upang palitan ang attribute na node.nextSibling.

Paliwanag ng Kodigo:

Ang uri ng elemento node ay 1. Kung ang magkaparehong node ay hindi isang element node, ilipat sa susunod na node hanggang makasumpong ng element node. Sa pamamagitan ng ganitong paraan, sa IE at Firefox, maaaring makakuha ng katulad na resulta.

Hanapin ang unang elemento

Ang sumusunod na kodigo ay nagpapakita ng unang elemento node ng unang <book>:

<html>
<head>
<script type="text/javascript" src="loadxmldoc.js">
</script>
<script type="text/javascript">
//tungkulin na suriin kung ang unang node ay isang 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 中
  • 在第一个 <book> 上使用 get_firstChild 函数,来获取元素节点中的第一个子节点
  • 输出第一个子节点(属于元素节点)的节点名

TIY

实例

下面的例子使用相似的函数:

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