Javascript里使用Dom操作Xml


Posted in Javascript onSeptember 20, 2006

一.Xml文件
二.IXMLDOMDocument/DOMDocument简介 
2.1 属性
2.1.1  parseError 
2.1.2  async. 
2.1.3  xml 
2.1.4  text 3 
2.1.5  attributes 
2.1.6  nodeName
2.1.7  documentElement 
2.1.8  nextSibling
2.1.9  childNodes
2.1.10  firstChild
2.1.11  lashChild
2.2 方法
2.2.1  loadXML
2.2.2  load
2.2.3  selectSingleNode
2.2.4  selectNodes
2.2.5  getElementsByTagName
2.2.6  hasChildNodes
三.例子
一.Xml文件 
<?xml version="1.0"?>
<book level="1"> 
  <Name>c++</Name> 
  <Price>20</Price> 
 <info>
<k>1</k>
  </info>
  <info>
    <k>2</k> 
  </info> 
</book> 
在asp.net下实现代码:
string str = Server.MapPath("test1.xml"); 
XmlTextWriter xmlWriter = new XmlTextWriter(str,null); 
xmlWriter.Formatting = System.Xml.Formatting.Indented; 
xmlWriter.WriteStartDocument(); 
xmlWriter.WriteStartElement("book"); 
xmlWriter.WriteAttributeString("level","1"); 
xmlWriter.WriteElementString("Name","c++"); 
xmlWriter.WriteElementString("Price","20"); 
xmlWriter.WriteStartElement("info"); 
xmlWriter.WriteElementString("k","1"); 
xmlWriter.WriteEndElement(); 
xmlWriter.WriteStartElement("info"); 
xmlWriter.WriteElementString("k","2"); 
xmlWriter.WriteEndElement(); 
xmlWriter.WriteEndElement(); 
xmlWriter.WriteEndDocument(); 
xmlWriter.Close(); 
二.IXMLDOMDocument/DOMDocument简介 
2.1 属性 
2.1.1  parseError 
Returns an IXMLDOMParseError object that contains information about the last parsing error
返回解析错误时的一个对象。
重要的有parseError.errorCode,parseError.reason
如果load时路径不对,会返回“系统未找到指定的对象”的错误
2.1.2  async 
Specifies whether asynchronous download is permitted
是否允许异步下载,布尔值
2.1.3  xml 
Contains the XML representation of the node and all its descendants. Read-only.
该点及下面派生的所有点的全部信息,只读如果要求book点的xml,返回“<book level="1"><Name>c++</Name><Price>20</Price><info><k>1</k></info><info><k>2</k></info></book>”,如果Name的xml,返回“<Name>c++</Name>”
2.1.4  text 
Represents the text content of the node or the concatenated text representing the node and its descendants. Read/write
该点及下面派生的所有点的全部节点值,可读可写
<price>20</price>
则text为20
"Name"节点的text为"c++"
2.1.5  attributes 
Contains the list of attributes for this node
返回属性的集合。
2.1.6  nodeName 
Returns the qualified name for attribute, document type, element, entity, or notation nodes. Returns a fixed string for all 
other node types. Read-only
该节点名称
"Name"节点的nodeName为"Name","book"节点的nodeName为"book"
2.1.7  documentElement 
Contains the root element of the document
xml的根节点
上面的xml的根节点为"book"
2.1.8  nextSibling 
Contains the next sibling of the node in the parent's child list. Read-only.
下一个兄弟节点,只读
2.1.9  childNodes 
Contains a node list containing the child nodes
所有的子节点。
2.1.10  firstChild 
Contains the first child of the node
第一个子节点
2.1.11  lastChild 
Returns the last child node
最后一个子节点
2.2 方法 
2.2.1  loadXML 
Loads an XML document using the supplied string
2.2.2  load 
Loads an XML document from the specified locati
参数的路径为服务器端的,是相对路径
2.2.3  selectSingleNode 
Applies the specified pattern-matching operation to this node's context and returns the first matching node
返回第一个匹配的项
2.2.4  selectNodes 
Applies the specified pattern-matching operation to this node's context and returns the list of matching nodes as IXMLDOMNodeList
符合条件的所有项。
2.2.5  getElementsByTagName 
Returns a collection of elements that have the specified name
返回与元素名匹配的一个node的集合
2.2.6  hasChildNodes 
Provides a fast way to determine whether a node has children
判断是否含有子节点
返回值为bool值
三.例子 
var xmlDoc = new ActiveXObject("Msxml2.DOMDocument.3.0");
xmlDoc.async = false;
xmlDoc.load("test\\test1.xml");
if (xmlDoc.parseError.errorCode!=0)
{
var error = xmlDoc.parseError;
  alert(error.reason)
return;
}
var root = xmlDoc.documentElement;   //根节点
Form1.test1.value = root.xml;
/*结果如下:
<book level="1"><Name>c++</Name><Price>20</Price><info><k>1</k></info><info><k>2</k></info></book>*/
Form1.test1.value = root.nodeName;  //结果为"book"
var att = root.attributes;  //得到该点下所有属性的集合
var str = "";
for (var i=0; i<att.length; i++)
{
str += att.item(i).nodeName+":"+att.item(i).text;
}
Form1.test1.value = str;  //只有一个属性,所以结果为“level:1”
var fNode;
var lNode;
var nextSibling;
fNode = root.firstChild;   //第一个子节点Name
lNode = root.lastChild;    //最后一个子节点 info
nextSibling = fNode.nextSibling;  //第一个子节点Name的后一个兄弟节点,即Price
str = fNode.nodeName + ":" + fNode.text;  //结果:"Name:c++"
str = lNode.nodeName + ":" + lNode.text;  //结果为:"info:2"
str = nextSibling.nodeName + ":"  + nextSibling.text;  //结果为:"Price:20"
var nodeList;
str = "";
nodeList = xmlDoc.selectNodes("//info");  //查找元素名为"info"的节点
for (var j=0; j<nodeList.length; j++)  //有两个info节点
{
var infoNode = nodeList.item(j);
var cldNodes = infoNode.childNodes;  //info节点的子节点集
for (var k=0; k<cldNodes.length; k++)
{
       str += cldNodes.item(k).nodeName + ":" + cldNodes.item(k).text + " ";
}
//结果“k:1 k:2 ”
}
str = "";
var sNode;
sNode = xmlDoc.selectSingleNode("//info"); //找到第一个和"info"匹配的
var scldNodes = sNode.childNodes;  //info节点的子节点集
for (var t=0; t<scldNodes.length; t++)
{
str += scldNodes.item(t).nodeName + ":" + scldNodes.item(t).text + " ";
}
//结果“k:1”
Form1.test1.value = str;

Javascript 相关文章推荐
动态添加js事件实现代码
Mar 12 Javascript
Firefox和IE兼容性问题及解决方法总结
Oct 08 Javascript
node.js使用nodemailer发送邮件实例
Mar 10 Javascript
元素未显示设置width/height时IE中使用currentStyle获取为auto
May 04 Javascript
jQuery实现Twitter的自动文字补齐特效
Nov 28 Javascript
针对JavaScript中this指向的简单理解
Aug 26 Javascript
使用vue的v-for生成table并给table加上序号的实例代码
Oct 27 Javascript
jQuery使用bind动态绑定事件无效的处理方法
Dec 11 jQuery
angular4中引入echarts的方法示例
Jan 29 Javascript
Vue数据双向绑定底层实现原理
Nov 22 Javascript
vue简单封装axios插件和接口的统一管理操作示例
Feb 02 Javascript
vue递归获取父元素的元素实例
Aug 07 Javascript
Js+XML 操作
Sep 20 #Javascript
发现的以前不知道的函数
Sep 19 #Javascript
多个iframe自动调整大小的问题
Sep 18 #Javascript
跨浏览器的设置innerHTML方法
Sep 18 #Javascript
JavaScript Base64编码和解码,实现URL参数传递。
Sep 18 #Javascript
JavaScript静态的动态
Sep 18 #Javascript
基于Web标准的UI组件 — 树状菜单(2)
Sep 18 #Javascript
You might like
php基于session实现数据库交互的类实例
2015/08/03 PHP
PHP中set error handler函数用法小结
2015/11/11 PHP
OAuth认证协议中的HMACSHA1加密算法(实例)
2017/10/25 PHP
PHP实现可添加水印与生成缩略图的图片处理工具类
2018/01/16 PHP
Jquery乱码的一次解决过程 图解教程
2010/02/20 Javascript
jQuery 翻牌或百叶窗效果(内容三秒自动切换)
2012/06/14 Javascript
js防止表单重复提交的两种方法
2013/09/30 Javascript
js正则匹配出所有图片及图片地址src的方法
2015/06/08 Javascript
js代码实现点击按钮出现60秒倒计时
2021/01/28 Javascript
对js中回调函数的一些看法
2016/08/29 Javascript
Vue2递归组件实现树形菜单
2017/04/10 Javascript
js 事件的传播机制(实例讲解)
2017/07/20 Javascript
详解让sublime text3支持Vue语法高亮显示的示例
2017/09/29 Javascript
layui table 参数设置方法
2018/08/14 Javascript
nodejs中express入门和基础知识点学习
2018/09/13 NodeJs
利用d3.js力导布局绘制资源拓扑图实例教程
2019/01/08 Javascript
angular中如何绑定iframe中src的方法
2019/02/01 Javascript
js中数组常用方法总结(推荐)
2019/04/09 Javascript
微信小程序实现定位及到指定位置导航的示例代码
2019/08/20 Javascript
[37:02]OG vs INfamous 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
利用Python yagmail三行代码实现发送邮件
2018/05/11 Python
使用python画个小猪佩奇的示例代码
2018/06/06 Python
Python并发:多线程与多进程的详解
2019/01/24 Python
使用Python实现画一个中国地图
2019/11/23 Python
详解python中的lambda与sorted函数
2020/09/04 Python
Under Armour安德玛法国官网:美国高端运动科技品牌
2018/06/29 全球购物
飞利浦法国官网:Philips法国
2019/07/10 全球购物
技校学生个人职业生涯规划范文
2014/03/03 职场文书
高级工程师英文求职信
2014/03/19 职场文书
新闻工作者先进事迹
2014/05/26 职场文书
python 批量压缩图片的脚本
2021/06/02 Python
如何使用pdb进行Python调试
2021/06/30 Python
redis 存储对象的方法对比分析
2021/08/02 Redis
Python数据结构之队列详解
2022/03/21 Python
微软团队与 NASA 科学家和惠普企业(HPE)的工程师合作
2022/04/21 数码科技
利用Redis实现点赞功能的示例代码
2022/06/28 Redis