XML DOM - 导航节点

news/2025/2/3 11:56:50 标签: xml, javascript, 开发语言

可通过使用节点间的关系对节点进行导航。


导航 DOM 节点

通过节点间的关系访问节点树中的节点,通常称为导航节点("navigating nodes")。

在 XML DOM 中,节点的关系被定义为节点的属性:

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

下面的图像展示了 books.xml 中节点树的一个部分,并说明了节点之间的关系:

Node tree


DOM - 父节点

所有的节点都仅有一个父节点。下面的代码导航到 <book> 的父节点:

实例

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


尝试一下 »

实例解释:

  1. 使用 loadXMLDoc() 把 "books.xml" 载入 xmlDoc 中
  2. 获取第一个 <book> 元素
  3. 输出 "x" 的父节点的节点名称

避免空的文本节点

Firefox 以及其他一些浏览器,把空的空白或换行当作文本节点,而 Internet Explorer 不会这么做。

这会在使用以下属性:firstChild、lastChild、nextSibling、previousSibling 时产生一个问题。

为了避免导航到空的文本节点(元素节点之间的空格和换行符),我们使用一个函数来检查节点类型:

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

上面的函数允许您使用 get_nextSibling(node)来代替 node.nextSibling 属性。

代码解释:

元素节点的类型是 1。如果同级节点不是元素节点,就移动到下一个节点,直到找到元素节点为止。通过这个办法,在 Internet Explorer 和 Firefox 中,都可以得到相同的结果。


获取第一个子元素

下面的代码显示第一个 <book> 的第一个元素:

实例

<html> <head> <script src="loadxmldoc.js"> </script> <script>

// 检测第一个节点是否为元素节点 function get_firstChild(n) { y=n.firstChild; while (y.nodeType!=1) { y=y.nextSibling; } return y; } </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); x=get_firstChild(xmlDoc.getElementsByTagName("book")[0]); document.write(x.nodeName);

</script> </body> </html>

输出:

title


尝试一下 »

实例解释:

  1. 使用 loadXMLDoc() 把 "books.xml" 载入 xmlDoc 中
  2. 在第一个 <book> 元素上使用 get_firstChild 函数,来获取第一个子节点(属于元素节点)
  3. 输出第一个子节点(属于元素节点)的节点名称

http://www.niftyadmin.cn/n/5840771.html

相关文章

面试题-消失的数字-异或

消失的数字 数组nums包含从0到n的所有整数&#xff0c;但其中缺了一个。请编写代码找出那个缺失的整数。你有办法在 O(n) 时间内完成吗&#xff1f; 示例&#xff1a; 输入&#xff1a;[3,0,1] 输出&#xff1a;2 int missingNumber(int* nums, int numsSize) {}分析 本题对…

25寒假算法刷题 | Day1 | LeetCode 240. 搜索二维矩阵 II,148. 排序链表

目录 240. 搜索二维矩阵 II题目描述题解 148. 排序链表题目描述题解 240. 搜索二维矩阵 II 点此跳转题目链接 题目描述 编写一个高效的算法来搜索 m x n 矩阵 matrix 中的一个目标值 target 。该矩阵具有以下特性&#xff1a; 每行的元素从左到右升序排列。每列的元素从上到…

Vue3.0实战:大数据平台可视化(附完整项目源码)

文章目录 创建vue3.0项目项目初始化项目分辨率响应式设置项目顶部信息条创建页面主体创建全局引入echarts和axios后台接口创建express销售总量图实现完整项目下载项目任何问题都可在评论区,或者直接私信即可。 创建vue3.0项目 创建项目: vue create vueecharts选择第三项:…

【Numpy核心编程攻略:Python数据处理、分析详解与科学计算】2.13 零拷贝技巧:as_strided的魔法与风险

2.13 零拷贝技巧&#xff1a;as_strided的魔法与风险 目录 #mermaid-svg-ieI7OVDIdPJxsrfJ {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-ieI7OVDIdPJxsrfJ .error-icon{fill:#552222;}#mermaid-svg-ieI7OVDIdPJx…

w186格障碍诊断系统spring boot设计与实现

&#x1f64a;作者简介&#xff1a;多年一线开发工作经验&#xff0c;原创团队&#xff0c;分享技术代码帮助学生学习&#xff0c;独立完成自己的网站项目。 代码可以查看文章末尾⬇️联系方式获取&#xff0c;记得注明来意哦~&#x1f339;赠送计算机毕业设计600个选题excel文…

使用 Numpy 自定义数据集,使用pytorch框架实现逻辑回归并保存模型,然后保存模型后再加载模型进行预测,对预测结果计算精确度和召回率及F1分数

1. 导入必要的库 首先&#xff0c;导入我们需要的库&#xff1a;Numpy、Pytorch 和相关工具包。 import numpy as np import torch import torch.nn as nn import torch.optim as optim from sklearn.metrics import accuracy_score, recall_score, f1_score2. 自定义数据集 …

无法将“mklink”项识别为 cmdlet、函数、脚本文件或可运行程序的名称

mklink : 无法将“mklink”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写&#xff0c;如果包括路径&#xff0c;请确保路径正确&#xff0c;然后再试一次。 所在位置 行:1 字符: 1这是因为 在老版本系统中可以是用mklink来创建软连接&#xff0c;但在最…

Cypher入门

文章目录 Cypher入门创建数据查询数据matchoptional matchwhere分页with 更新数据删除数据实例&#xff1a;好友推荐 Cypher入门 Cypher是Neo4j的查询语言。 创建数据 在Neo4j中使用create命令创建节点、关系、属性数据。 create (n {name:$value}) return n //创建节点&am…