XML学习（二）详解DOM操作XML文档

黄舟

发布时间：2017-03-20 16:56:09

1694人浏览过

来源于php中文网

原创

在dom眼中，html跟xml一样是一种树形结构的文档。各个节点被视为各种类型的node对象。每个node对象都有自己的属性和方法，利用这些属性和方法可以遍历整个文档树。dom定义了nodetype来表示节点的类型

接口	nodeType常量	nodeType值	备注
Element	Node.ELEMENT_NODE	1	元素节点
Text	Node.TEXT_NODE	3	文本节点
Document	Node.DOCUMENT_NODE	9	document
Comment	Node.COMMENT_NODE	8	注释的文本
DocumentFragment	Node.DOCUMENT_FRAGMENT_NODE	11	document片断
Attr	Node.ATTRIBUTE_NODE	2	节点属性

DOM树的根节点是个Document对象，有时候document即指向整个文档。

Document定义的方法大多数是生产型方法，主要用于创建可以插入文档中的各种类型的节点。常用的Document方法有：

方法	描述
createAttribute()	用指定的名字创建新的Attr节点。
createComment()	用指定的字符串创建新的Comment节点。
createElement()	用指定的标记名创建新的Element节点。
createTextNode()	用指定的文本创建新的TextNode节点。
getElementById()	返回文档中具有指定id属性的Element节点。
getElementsByTagName()	返回文档中具有指定标记名的所有Element节点。

Element常用的方法：

方法	描述
getAttribute()	以字符串形式返回指定属性的值。
getAttributeNode()	以Attr节点的形式返回指定属性的值。
getElementsByTabName()	返回一个Node数组，包含具有指定标记名的所有Element节点的子孙节点，其顺序为在文档中出现的顺序。
hasAttribute()	如果该元素具有指定名字的属性，则返回true。
removeAttribute()	从元素中删除指定的属性。
removeAttributeNode()	从元素的属性列表中删除指定的Attr节点。
setAttribute()	把指定的属性设置为指定的字符串值，如果该属性不存在则添加一个新属性。
setAttributeNode()	把指定的Attr节点添加到该元素的属性列表中。 Pebblely AI产品图精美背景添加下载

Node对象常用属性：

属性	描述
attributes	如果该节点是一个Element，则以NamedNodeMap形式返回该元素的属性。
childNodes	以Node[]的形式存放当前节点的子节点。如果没有子节点，则返回空数组。
firstChild	以Node的形式返回当前节点的第一个子节点。如果没有子节点，则为null。
lastChild	以Node的形式返回当前节点的最后一个子节点。如果没有子节点，则为null。
nextSibling	以Node的形式返回当前节点的兄弟下一个节点。如果没有这样的节点，则返回null。
nodeName	节点的名字，Element节点则代表Element的标记名称。
nodeType	代表节点的类型。
parentNode	以Node的形式返回当前节点的父节点。如果没有父节点，则为null。
previousSibling	以Node的形式返回紧挨当前节点、位于它之前的兄弟节点。如果没有这样的节点，则返回null。

Node对象常用方法：

方法	描述
appendChild()	通过把一个节点增加到当前节点的childNodes[]组，给文档树增加节点。
cloneNode()	复制当前节点，或者复制当前节点以及它的所有子孙节点。
hasChildNodes()	如果当前节点拥有子节点，则将返回true。
insertBefore()	给文档树插入一个节点，位置在当前节点的指定子节点之前。如果该节点已经存在，则删除之再插入到它的位置。
removeChild()	从文档树中删除并返回指定的子节点。
replaceChild()	从文档树中删除并返回指定的子节点，用另一个节点替换它。

获取元素的值

下面的代码检索第一个

元素的文本值：<pre class="brush:xml;toolbar:false;">x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];txt=x.nodeValue; //其实应该先判断节点是否存在</pre>结果：txt = "Harry Potter" <h2>获取属性的值</h2> 下面的代码检索第一个 <title> 元素的 "<a href="http://www.php.cn/java/java-ymp-Lang.html" target="_blank">lang</a>" 属性的文本值：<pre class="brush:xml;toolbar:false;">txt=xmlDoc.getElementsByTagName("title")[0].getAttribute("lang");</pre>结果：txt = "en" <h2>改变元素的值</h2> 下面的代码改变第一个 <title> 元素的文本值：<pre class="brush:xml;toolbar:false;">x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];x.nodeValue="Easy Cooking";</pre><h2>改变属性的值</h2> setAttribute() 方法可用于改变已有属性的值，或创建一个新属性。 下面的代码向每个 <book> 元素添加了名为 "edition" 的新属性（值是 "first"）：</book><pre class="brush:xml;toolbar:false;">x=xmlDoc.getElementsByTagName("book");for(i=0;i<x.length;i++) { x[i].setAttribute("edition","first"); }</pre><h2>创建元素</h2> createElement() 方法创建新的元素节点。 createTextNode() 方法创建新的文本节点。 appendChild() 方法向节点添加子节点（在最后一个子节点之后）。 如需创建带有文本内容的新元素，需要同时创建元素节点和文本节点。 下面的代码创建了一个元素 (<edition>)，然后把它添加到第一个 <book> 元素中：</book></edition><pre class="brush:xml;toolbar:false;">newel=xmlDoc.createElement("edition");</pre><pre class="brush:xml;toolbar:false;">newtext=xmlDoc.createTextNode("First");</pre><pre class="brush:xml;toolbar:false;">newel.appendChild(newtext);</pre><pre class="brush:xml;toolbar:false;">x=xmlDoc.getElementsByTagName("book");x[0].appendChild(newel);</pre><h3>例子解释：</h3> <ol class=" list-paddingleft-2"> <li>创建 <edition> 元素</edition></li> <li>创建值为 "First" 的文本节点</li> <li>把这个文本节点追加到 <edition> 元素</edition></li> <li>把 <edition> 元素追加到第一个 <book> 元素</book></edition></li> </ol> <h2>删除元素</h2> removeChild() 方法删除指定的节点（或元素）。 下面的代码片段将删除第一个 <book> 元素中的第一个节点：</book><pre class="brush:xml;toolbar:false;">x=xmlDoc.getElementsByTagName("book")[0];x.removeChild(x.childNodes[0]);</pre><h2>实例代码</h2><pre class="brush:xml;toolbar:false;"><html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script type="text/<a href="http://www.php.cn/wiki/48.html" target="_blank">javascript</a>"> function parseXML() { try //Internet Explorer { xmlDoc = new ActiveX<a href="http://www.php.cn/wiki/60.html" target="_blank">Object</a>("Microsoft.XMLDOM"); } catch (e) { try //Firefox, Mozilla, Opera, etc. { xmlDoc = document.implementation.createDocument("", "", null); } catch (e) { alert(e.message); <a href="http://www.php.cn/wiki/135.html" target="_blank">return</a>; } } xmlDoc.async = false; //假如xml载入完毕执行以下 xmlDoc.load("note.xml"); var x = xmlDoc.getElementsByTagName("to"); // xmlDoc.getElementsByTagName("to")[0].setAttribute("<a href="http://www.php.cn/wiki/1255.html" target="_blank">date</a>") = "1515"; //设置属性值 // xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue = "tiewang"; //设置文本节点值 // //<a href="http://www.php.cn/code/6276.html" target="_blank">循环</a>修改 // for (i = 0; i < x.length; i++) { // if (x[i].childNodes[0] == null) { //如果不存在问题，则添加 // newText1 = xmlDoc.createTextNode("af"); // x[i].appendChild(newText1); // } // x[i].childNodes[0].nodeValue = "af"; // } // //循环添加 //注意，如果把create放在<a href="http://www.php.cn/code/5913.html" target="_blank">for循环</a>外面，则只能添加到最后一个，需要放在for里面 for (i = 0; i < x.length; i++) { if (x[i].getElementsByTagName("too")[0] == null) { newElemenet = xmlDoc.createElement("too"); newText = xmlDoc.createTextNode("logo"); newElemenet.setAttribute("id", "1"); newElemenet.appendChild(newText); x[i].appendChild(newElemenet); } } // //循环删除 // for (i = 0; i < x.length; i++) { // if (x[i].getElementsByTagName("too")[0] != null) { // x[i].removeChild(x[i].getElementsByTagName("too")[0]); // } // } 　　　　 　　　　　　//删除to -> too 节点中的ID属性 for (i = 0; i < x.length; i++) { if (x[i].getElementsByTagName("too")[0] != null) { if (x[i].getElementsByTagName("too")[0].getAttribute("id")!=null) { x[i].getElementsByTagName("too")[0].removeAttribute("id"); } } } var xmlHttp; try { // Firefox, Opera 8.0+, Safari xmlHttp = new XMLHttpRequest(); } catch (e) { // Internet Explorer try { xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert("您的浏览器不支持AJAX！"); return false; } } } xmlHttp.onreadystatechange = function() { //onreadystatechange 属性存有处理服务器响应的<a href="http://www.php.cn/wiki/145.html" target="_blank">函数</a> if (xmlHttp.readyState == 4) { //readyState 属性存有服务器响应的<a href="http://www.php.cn/code/8243.html" target="_blank">状态</a>信息 document.getElementById("to").innerHTML = xmlHttp.responseText; //通过 responseText 属性来取回由服务器返回的数据 } } xmlHttp.open("POST", "receive.<a href="http://www.php.cn/wiki/1519.html" target="_blank">asp</a>x?type=xmlsave", true); // open() 方法需要三个参数。第一个参数定义发送请求所使用的方法（GET 还是 POST）。第二个参数规定服务器端脚本的 URL。第三个参数规定应当对请求进行异步地处理。 xmlHttp.send(xmlDoc); //send() 方法可将请求送往服务器 } </script> </head> <body <a href="http://www.php.cn/wiki/1467.html" target="_blank">onload</a>="parseXML()"> <form id="form1" runat="server"> <p> <h1 id = "to"></h1> <h1 id ="value"></h1> </p> </form> </body> </html></pre>

Scala xml库如何使用模式匹配来解析XML

XML批量上传如何实现如何设计接口支持多文件

PHP cURL如何上传XML文件 CURLOPT_POSTFIELDS怎么用

Java XML解析“Premature end of file”异常怎么解决

Java Panama项目(Foreign Function)如何调用C库解析XML

本站声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

上一篇：XML学习（一）元素，属性，读取详解下一篇：XML学习（三） js保存xml的示例代码分享

作者最新文章

HTML5 Placeholder属性的详情介绍

2018-05-30 09:51

html中关于标签的全部属性的使用总结

2018-05-30 14:32