DOM (Document Object Model,文档对象模型)定义访问和操作文档的一套标准方法。

XML DOM

XML DOM (XML Document Object Model) 定义一套访问和操作 XML 文档的标准方法。

DOM 把 XML 文档作为树结构来查看。能够通过 DOM 树来访问所有元素。可以修改或删除它们的内容,并创建新的元素。元素,它们的文本,以及它们的属性,都被认为是节点。

在下面的例子中,我们使用 DOM 引用从 <to> 元素中获取文本:

xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue
  • xmlDoc -由解析器创建的 XML 文档

  • getElementsByTagName("to")[0] - 第一个 <to> 元素

  • childNodes[0] - <to> 元素的第一个子元素(文本节点)

  • nodeValue - 节点的值(文本本身)

HTML DOM

HTML DOM (HTML Document Object Model) 定义一套访问和操作 HTML 文档的标准方法。

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

在下面的例子中,我们使用 DOM 引用来改变 id="to" 的 HTML 元素的文本:

document.getElementById("to").innerHTML=
  • document - HTML 文档

  • getElementById("to") - 其中的 id="to" 的 HTML 元素

  • innerHTML - HTML 元素的内部文本

解析 XML 文件 - 跨浏览器实例

下列代码把一个 XML 文档 ("note.xml") 载入 XML 解析器中:

<html><head><script type="text/javascript">function parseXML(){try //Internet Explorer  {  xmlDoc=new ActiveXObject("Microsoft.XMLDOM");  }catch(e)  {  try //Firefox, Mozilla, Opera, etc.    {    xmlDoc=document.implementation.createDocument("","",null);    }  catch(e)    {    alert(e.message);    return;    }  }xmlDoc.async=false;xmlDoc.load("note.xml");document.getElementById("to").innerHTML=xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue;document.getElementById("from").innerHTML=xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue;document.getElementById("message").innerHTML=xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue;}</script></head><body onload="parseXML()"><h1>W3School.com.cn Internal Note</h1><p><b>To:</b> <span id="to"></span><br /><b>From:</b> <span id="from"></span><br /><b>Message:</b> <span id="message"></span></p></body></html>

输出:

To: GeorgeFrom: JohnMessage: Don't forget the meeting!

重要注释

如需从 XML 中提取文本 "John",语法是:

getElementsByTagName("from")[0].childNodes[0].nodeValue

在这个 XML 例子中,只有一个 <from> 标签中,但是仍然需要规定数组的下标 [0],这是因为 XML 解析器方法 getElementsByTagName() 返回所有 <from> 节点的一个数组。

解析 XML 字符串 - 跨浏览器实例

下面的代码加载并解析一个 XML 字符串:

<html><head><script type="text/javascript">function parseXML(){text="<note>";text=text+"<to>George</to>";text=text+"<from>John</from>";text=text+"<heading>Reminder</heading>";text=text+"<body>Don't forget the meeting!</body>";text=text+"</note>";try //Internet Explorer  {  xmlDoc=new ActiveXObject("Microsoft.XMLDOM");  xmlDoc.async="false";  xmlDoc.loadXML(text);  }  catch(e)  {  try // Firefox, Mozilla, Opera, etc.    {    parser=new DOMParser();    xmlDoc=parser.parseFromString(text,"text/xml");    }  catch(e)    {    alert(e.message);    return;    }  }document.getElementById("to").innerHTML=xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue;document.getElementById("from").innerHTML=xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue;document.getElementById("message").innerHTML=xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue;}</script></head><body onload="parseXML()"><h1>W3School.com.cn Internal Note</h1><p><b>To:</b> <span id="to"></span><br /><b>From:</b> <span id="from"></span><br /><b>Message:</b> <span id="message"></span></p></body></html>

输出:

To: GeorgeFrom: JohnMessage: Don't forget the meeting!

注释:Internet Explorer 使用 loadXML() 方法来解析 XML 字符串,而其他浏览器使用 DOMParser 对象。

更多相关文章

  1. xml学习(2)xml文档树结构图
  2. 灵活调用xsl来解析xml文档(js异步)
  3. 如何得到XML文档大小的详细介绍
  4. XML文档搜索使用小结
  5. XML—尝试对一个XML文档进行增删查改编程的详解
  6. 详解通过XmlDocument读写Xml文档的示例代码
  7. XML中的树形结构与DOM文档对象模型的示例代码(图)
  8. XSLT语法—在.net中使用XSLT转换xml文档的示例代码详解
  9. XML中的DTD文档类型定义详细介绍

随机推荐

  1. 关于python return 和 print 的区别
  2. python基础练习--列表问题
  3. python list range 字符串的截取 如 text
  4. 如何将两个列表中的数据写入csv中的列?
  5. Python list 交集,并集,差集
  6. Python 卡方检验、克雷姆值
  7. 运用Python语言编写获取Linux基本系统信
  8. 从0开始的Python学习019更多的Python内容
  9. gsutil - 正则表达式与替代不工作
  10. 第五十九节,模拟浏览器请求Python结合html