javascript之XML DOM的解析
一、xml文件的定义
<?xml version="1.0" encoding="gbk"?>
<china>
<province name="吉林省">
<city>长春</city>
<city>吉林市</city>
<city>四平</city>
<city>松原</city>
<city>通化</city>
</province>
<province name="辽宁省">
<city>沈阳</city>
<city>大连</city>
<city>鞍山</city>
<city>抚顺</city>
<city>铁岭</city>
</province>
<province name="山东省">
<city>济南</city>
<city>青岛</city>
<city>威海</city>
<city>烟台</city>
<city>潍坊</city>
</province>
</china>
二、xml文件解析器的util类（跨浏览器）
function parseXML(fileXmlName){
var xmlDoc;
try {
//Internet Explorer 创建一个空的xml文档
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
}
catch (e) {
try {
//Firefox, Mozilla, Opera, 创建一个空的xml文档
xmlDoc = document.implementation.createDocument("", "", null);
}
catch (e) {
}
}
//关闭异步加载
xmlDoc.async = false;
//加载xml文件
xmlDoc.load(fileXmlName);
return xmlDoc;
}
三、XML DOM访问节点
<html>
<head>
<title>test01.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="util.js"></script>
</head>
<body>
<select id="province" name="province">
<option value="">请选择....</option>
<option value="吉林省">吉林省</option>
<option value="辽宁省">辽宁省</option>
<option value="山东省">山东省</option>
</select>
<select id="city" name="city">
<option value="">请选择.....</option>
</select>
</body>
<script language="JavaScript">
//获取第一个下拉选择框时，显示对应的省份信息
document.getElementById("province").onchange = function () {
//处理上一级节点的值
var cityElement = document.getElementById("city");
var optionElements =cityElement.getElementsByTagName("option");
for(var z=1;z<optionElements.length;z++){
cityElement.removeChild(optionElements[z]);
z--;
}
//1.获取页面选中的省份信息
var provinceElement = this.value;
//2.创建xml解析器,参数传递xml文件
var docXml = parseXML("cities.xml");
//3.获取xml文件所有对应的province标签
var provinceXmlElements = docXml.getElementsByTagName("province");
//4.遍历province标签
for (var i = 0; i < provinceXmlElements.length; i++) {
var provinceXmlElement = provinceXmlElements[i];
var provinceXmlValue = provinceXmlElement.getAttribute("name");
//5.对比(页面==xml)
if (provinceXmlValue == provinceElement) {
//6.获取获取xml文件所有对应的province下的所有city标签
var cityXmlElements = provinceXmlElement.getElementsByTagName("city");
//7.遍历city标签
for (var j = 0; j < cityXmlElements.length; j++) {
var cityXmlElement = cityXmlElements[j];
// var cityXmlValue = cityXmlElement.fistChild.nodeValue;
var cityXmlValue = cityXmlElement.text;
//8.增加city值
var optionElement = document.createElement("option");
optionElement.setAttribute("value", cityXmlValue);
var text = document.createTextNode(cityXmlValue);
optionElement.appendChild(text);
cityElement.appendChild(optionElement);
}
}
}
}
</script>
</html>
四、XML DOM 操作 XML文档
XML DOM中创建节点，删除节点，移动节点,读写节点数据等操作与HTML DOM的操作相同
相关推荐
javaｓｃｒｉｐｔ中，不论是解析xml文件，还是xml格式的字符串，都是通过DOM对象来进行操作的。希望本文档会给有需要的朋友带来帮助；感兴趣的朋友可以过来看看 资源截图： 资源太大，传百度网盘了，链接...
java script dom 解析，改书讲解了如何使用javascript解析xml文档。
var xmlDoc = new ActiveXObject("Microsoft.XMLDOM") 'JAVASCRIPT中的创建对象 set objXml=CreateObject("Microsoft.XMLDOM") '创建解析器对象 objXml.async="false" objXml.load("test.xml") '装载xml文件 ...
XMLDOM xmldom 是一个 javascript 用于浏览器支持的以下 API： 将 XML 字符串转换为 DOM 树（ new DOMParser().parseFromString(xml, mimeType) => Document ） 创建、访问和修改 DOM 树（ new DOMImplementation()....
var xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async="false"; xmlDoc.load("ceshi.xml"); var node = xmlDoc.documentElement.selectNodes("/a/b/c/d"); var s = ""; for(var i=0;i;i++){ ...
XML解析器，Stringifier和DOM 使用非常宽容的XML解析器解析XML，HTML等，并将其转换为DOM。 这三个组件作为各自的模块彼此分开。 零件 尺寸 解析器 4.7 KB 串词器 1.3 KB DOM 3.1 KB 安装 npm install xml-...
3.1 DOM不是JavaScript，它是文档 3.2 DOM的级别 3.2.1 DOM 0 级 3.2.2 DOM 1 级 3.2.3 DOM 2 级 3.2.4 DOM 3 级 3.2.5 哪个级别适合你 3.3 创建示例文档 3.3.1 创建DOM...
实例如下： var xmlDoc = null; function LoadXml(xmlPath) { ... xmlDoc = new ActiveXObject(Microsoft.XMLDOM); } } catch (e) { try { xmlDoc = document.implementation.createDocument(, , null); }
xml导出多级导航栏.通过javascript读取xml然后生成print页面中的导航栏
代码如下: if (window.ActiveXObject){ var doc=new ActiveXObject(“Microsoft.XMLDOM”); doc.async=”false”; doc.loadXML(strXml); }else{ var parser=new DOMParser(); var doc=parser.parseFromString...
它使用浏览器的 DOMParser（在 IE 的情况下使用 XMLDOM ActiveX 组件）。 没有像 X2JS 这样的依赖。 安装 bower install --save angular-xml2js XML JSON 示例 对于以下 XML 文档 <?xml version="1.0"?> ...
fromXML-纯JavaScript XML解析器 现场演示： : 特征 简单：单个解析器函数fromXML(xml)返回JavaScript对象。 小型：缩小2KB，压缩后1KB。 独立：无需外部模块依赖性也不需要DOM。 TypeScript定义： 概要 Node....
但是是XML字符串，则在两种浏览器下就会有所不同，IE下可以直接使用LoadXML方法解析XML字符串,而在FF下则要使用DOMParser 对象的parseFromString() 方法即 var oParser=new DOMParser(); xmlDoc=oParser....
使用dom,dom4j,jdom生成和解析XML文档实例，使用基于事件的SAX解析XML文档实例，使用jquery,javascript动态的生成DOM实例，使用jquery,javascript解析ajax回传的XML文档实例，jquery,javascript的ajax技术使用实例，...
DOM是针对XML的基于树的API，它关注的不仅仅是解析XML代码，而是用一系列相互关联的对象来表示这些代码，而这些对象可以被修改，而且无需重新解析代码就能直接访问它们。由于DOM的使用上的简便，因此它成为了Web...
用于客户端 JavaScript 的 jQuery 驱动的 XML 解析器 这个轻量级的 XML 解析器使用 jQuery 为格式良好的 XML 文档提供了直接的解析和编组。 用法与处理 HTML DOM 时几乎相同。 该脚本定义了 XMLParser 对象，它提供...
本笔记使用的Xml文件 二．IXMLDOMDocument/DOMDocument简介 2．1 属性 2．1．1 parseError 2．1．2 async. 2．1．3 xml 2．1．4 text3 2．1．5 attributes 2．1．6 nodeName 2．1．7 documentElement ...
010302_XML解析 —— DOM 010303_XML解析 —— SAX 010304_XML解析 —— JDOM 010305_XML解析 —— DOM4J 010306_使用JavaScript操作DOM 010401_Tomcat服务器的安装及配置 020501_注释及Scriptlet 020502_page指令 ...
第十五章 JavaScript与XML 1.浏览器对XML DOM的支持 1.1 DOM2级核心 ①在DOM2级在document.implementation中引入了createDocument()方法（IE6~8...var xmldom = document.implementation.createDocument(“”,”root”,
XML document对象模型手册包括了JavaScript对Dom结点的解析和对XML的操作。