Định vị nút XML DOM

có thể định vị nút thông qua mối quan hệ giữa các nút.

Ví dụ

Ví dụ dưới đây sử dụng tệp XML books.xml.

Hàm loadXMLDoc()nằm ở JavaScript bên ngoài, dùng để tải tệp XML.

Lấy nút bậc trên của nút
Ví dụ này sử dụng thuộc tính parentNode để lấy nút cha của nút.
Lấy nút con đầu tiên của nút
Ví dụ này sử dụng phương thức firstChild() và hàm tùy chỉnh để lấy nút con đầu tiên của một nút.

Định vị DOM nút

Truy cập các nút trong cây nút thông qua mối quan hệ giữa các nút, thường được gọi là định vị nút ("navigating nodes").

Trong XML DOM, mối quan hệ giữa các nút được xác định bởi các thuộc tính của nút:

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

Hình ảnh dưới đây minh họa books.xml Một phần của cây nút và giải thích về mối quan hệ giữa các nút:

Cây node DOM

DOM - nút cha

Mọi nút đều chỉ có một nút cha. Mã dưới đây định vị đến nút cha của <book>:

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

Giải thích ví dụ:

  • Bằng cách sử dụng loadXMLDoc() Bỏ "books.xml" tải vào xmlDoc
  • Lấy element đầu tiên <book>
  • Xuất tên của nút bậc trên của "x"

TIY

Tránh các nút text rỗng

Firefox và một số trình duyệt khác, coi các khoảng trống hoặc ký tự enter trống là các nút text, trong khi IE không làm điều đó.

Điều này sẽ tạo ra một vấn đề khi sử dụng các thuộc tính sau: firstChild, lastChild, nextSibling, previousSibling.

Để tránh定位 đến các nút text rỗng (các khoảng trống và ký tự enter giữa các nút element), chúng ta sử dụng một hàm để kiểm tra loại nút:

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

Với hàm trên, chúng ta có thể sử dụng get_nextSibling(node) để thay thế thuộc tính node.nextSibling.

Giải thích mã:

Loại nút element là 1. Nếu nút cùng cấp không phải là nút element, di chuyển đến nút tiếp theo cho đến khi tìm thấy nút element. Bằng cách này, trong IE và Firefox, bạn có thể nhận được kết quả tương tự.

Lấy nút element đầu tiên

Mã dưới đây hiển thị nút element đầu tiên của <book> đầu tiên:

<html>
<head>
<script type="text/javascript" src="loadxmldoc.js">
</script>
<script type="text/javascript">
//kiểm tra xem nút đầu tiên có phải là nút element không
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>

Xuất ra:

title

Giải thích ví dụ:

  • Bằng cách sử dụng loadXMLDoc() Bỏ "books.xml" Đang tải xmlDoc"
  • Sử dụng hàm get_firstChild trên phần tử <book> đầu tiên để lấy nút con đầu tiên trong phần tử phần tử
  • Xuất ra tên của nút con đầu tiên (thuộc nút phần tử)

TIY

Ví dụ

Ví dụ dưới đây sử dụng các hàm tương tự:

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