XML 教程

XML 教程 XML 简介 XML 用途 XML 树结构 XML 语法 XML 元素 XML 属性 XML 命名空间 XML Display XML HttpRequest XML Parser XML DOM XML XPath XML XSLT XML XQuery XML XLink XML 验证器 XML DTD XML Schema XML 服务器 XML 实例 XML 测验

XML AJAX

AJAX 简介 AJAX XMLHttp AJAX 请求 AJAX 响应 AJAX XML 文件 AJAX PHP AJAX ASP AJAX 数据库 AJAX 应用程序 AJAX 实例

XML DOM

DOM 简介 DOM 节点 DOM 访问节点 DOM 节点信息 DOM 节点列表 DOM 节点遍历 DOM 节点导航 DOM 获取节点 DOM 更改节点 DOM 删除节点 DOM 替换节点 DOM 创建节点 DOM 添加节点 DOM 克隆节点 DOM 实例

XPath 教程

XPath 简介 XPath 节点 XPath 语法 XPath 轴(Axes) XPath 运算符 XPath 实例

XSLT 教程

XSLT 简介 XSL 语言 XSLT 转换 XSLT <template> XSLT <value-of> XSLT <for-each> XSLT <sort> XSLT <if> XSLT <choose> XSLT Apply XSLT 客户端 XSLT 服务端 XSLT 编辑 XML XSLT 实例

XQuery 教程

XQuery 简介 XQuery 实例 XQuery FLWOR 表达式 XQuery FLWOR + HTML XQuery 术语 XQuery 语法 XQuery 添加元素和属性 XQuery 选择和过滤 XQuery 函数

XML DTD

DTD 简介 DTD 构建模块 DTD 元素 DTD 属性 DTD 元素 vs. 属性 DTD 实体 DTD 实例

XSD Schema

XSD 简介 XSD How To XSD <schema> XSD 元素 XSD 属性 XSD 限制

XSD Complex

XSD 复杂元素 XSD 空元素 XSD 仅限元素 XSD 纯文本元素 XSD 混合 XSD 指示器 XSD <any> XSD <anyAttribute> XSD 替换 XSD 实例

XSD 数据类型

XSD 字符串 XSD 日期 XSD 数值 XSD 杂项 XSD 参考手册

Web Services

XML Services 简介 XML WSDL XML SOAP XML RDF XML RSS

参考手册

DOM 节点类型 DOM 节点 DOM NodeList DOM NamedNodeMap DOM 文档 DOM 元素 DOM 属性 DOM 文本 DOM CDATA DOM 注释 DOM XMLHttpRequest DOM 解析器 XSLT 元素 XSLT/XPath 函数


XML DOM 教程

XML DOM

DOM node tree

什么是DOM?

DOM定义了访问和操作文档的标准:

"W3C文档对象模型(DOM)是一个平台和语言中立的接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样式。"

HTML DOM 定义了访问和操作HTML文档的标准方法。它将HTML文档呈现为树结构。

XML DOM 定义了访问和操作XML文档的标准方法。它将XML文档呈现为树结构。

任何使用HTML或XML的人都必须理解DOM。


HTML DOM

所有HTML元素都可以通过 HTML DOM访问。

此实例使用id="demo"更改HTML元素的值:

实例

<h1 id="demo">这是一个标题</h1>

<script>
document.getElementById("demo").innerHTML = "Hello World!";
</script>
尝试一下 »

此实例更改HTML文档中第一个<h1>元素的值:

实例

<h1>这是一个标题</h1>

<h1>这是一个标题</h1>

<script>
document.getElementsByTagName("h1")[0].innerHTML = "Hello World!";
</script>
尝试一下 »

注释: 即使HTML文档只包含一个<h1>元素,您仍然必须指定数组索引[0],因为getElementsByTagName()方法总是返回一个数组。

在我们的JavaScript教程中,您可以了解更多关于 JavaScript 教程的信息。



XML DOM

所有XML元素都可以通过XML DOM访问。

XML DOM 是:

  • XML的标准对象模型
  • XML标准编程接口
  • 独立于平台和语言
  • W3C标准

换句话说:XML DOM 是如何获取、更改、添加或删除XML元素的标准。


获取XML元素的值

此代码检索XML文档中第一个<title>元素的文本值:

实例

txt = xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;

加载XML文件

下面实例中使用的XML文件是 books.xml.

本实例将"books.xml"读入xmlDoc,并检索books.xml中第一个<title>元素的文本值:

实例

<!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;
    document.getElementById("demo").innerHTML =
    xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;
}
</script>

</body>
</html>
尝试一下 »

实例说明

  • xmlDoc - 解析器创建的XML DOM对象。
  • getElementsByTagName("title")[0] - 获取第一个<title>元素
  • childNodes[0] - <title>元素的第一个子元素(文本节点)
  • nodeValue - 节点的值(文本本身)

加载XML字符串

此实例将文本字符串加载到XML DOM对象中,并使用JavaScript从中提取信息:

实例

<html>
<body>

<p id="demo"></p>

<script>
var text, parser, xmlDoc;

text = "<bookstore><book>" +
"<title>Everyday Italian</title>" +
"<author>Giada De Laurentiis</author>" +
"<year>2005</year>" +
"</book></bookstore>";

parser = new DOMParser();
xmlDoc = parser.parseFromString(text,"text/xml");

document.getElementById("demo").innerHTML =
xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;
</script>

</body>
</html>
尝试一下 »

编程接口

DOM将XML建模为一组节点对象。可以使用JavaScript或其他编程语言访问这些节点。在本教程中,我们使用JavaScript。

DOM的编程接口由一组标准属性和方法定义。

Properties 属性通常被称为是(i.e. nodename is "book")

Methods 方法通常被称为已完成的事情(i.e. delete "book")


XML DOM 属性

以下是一些典型的DOM属性:

  • x.nodeName - x的名字
  • x.nodeValue - x的值
  • x.parentNode - x的父节点
  • x.childNodes - x的子节点
  • x.attributes - x的属性节点

注意:在上面的列表中,x是一个节点对象。


XML DOM方法

  • x.getElementsByTagName(name) - 获取具有指定标记名的所有元素
  • x.appendChild(node) - 将子节点插入到x
  • x.removeChild(node) - 从x中删除子节点

注意:在上面的列表中,x是一个节点对象。