首先 加载 XML 有两种方式, 外部载入 和 xml字符串解析
IE 是最早支持XML的浏览器
ActiveXObject对象实现的 IE9-MSXML2.DOMDocument.6.0 最新的版本
MSXML2.DOMDocument.3.0 javascript使用 建议使用版本
MSXML2.DOMDocument IE5
xml 与 html 的区别:
html是随意,
xml不是随意的 写的时候严格 标签要去闭合 xml区分大小写的。
创建对象 使用ActiveXObject()方法
function createXMLDom(){
var version = [
"MSXML2.DOMDocument.6.0",
"MSXML2.DOMDocument.3.0",
"MSXML2.DOMDocument"
];
for (var i=0;i<version.length;i++) {
try {
var xmlDom = new ActiveXObject(version[i]);
} catch(e) {
// 跳过
}
}
return xmlDom;
}
外部载入的方式
var xmlDom = createXMLDom();
xmlDom.async = true;
xmlDom.load("01 index.xml"); // load()方法 加载外部文件,参数为 文件名
xmlDom.onreadystatechange = function() {
if (xmlDom.readyState === 4) { //监听xml文档是否加载完成,当 readyState = 4 时说明页面已经加载完成
if(xmlDom.parseError === 0) { //判断xml文件是否存在错误,如语法错误等等
alert(xmlDom.xml)
} else {
/*
错误的行号 line
错误的位置 linepos
错误的信息 errorCode
错误的解释 reason
*/
throw new Error(
"错误的行号:"+xmlDom.parseError.line+"\n"+
"错误的位置:"+xmlDom.parseError.linepos+"\n"+
"错误的信息:"+xmlDom.parseError.errorCode+"\n"+
"错误的解释"+xmlDom.parseError.reason
)
}
}
}
XML 字符串解析
var xmlDom = createXMLDom(); //创建对象
xmlDom.loadXML("<root><user></user></root>"); //加载xml格式的字符串,注意与外部载入不同的是 loadXML()
alert(xmlDom.xml); //查看一下 注意:文件名后要有格式(.xml)
补充个细节,xml的载入在服务器和本地是不一样的,
xml在服务器端去load加载的时候 默认 异步加载 的过程,
外部载入,xml字符串解析都是 默认 同步加载。(定时器也是异步)
可以使用 obj.async = true; obj.async = false; 进行改变,true:异步;false : 同步
同步和异步的区别在于 同步要按顺序执行,干完一个才能干下一个,这样缺点就出来了,要是程序中有很占时间资源的在前面那么它后面的就要一直等待它执行完,所以这时就需要异步处理,将这个程序块放入异步处理语句中,这样就相当于把它扔到了后天自己默默地执行,而他后面的语句就不必等待了。
非IE浏览器(又分为火狐、谷歌)
创建对象:
// 创建xml对象
var xmlDom = document.implementation.createDocument('', 'root', null);
console.log(xmlDom.documentElement);//根节点
var user = xmlDom.createElement("user"); //创建自定义的标签(参数为标签名)
var text = xmlDom.createTextNode("text"); //这里就是你自己自定义的文本节点内容
user.appendChild(text);
xmlDom.documentElement.appendChild(user);
// 字符化
var str = (new XMLSerializer()).serializeToString(xmlDom);
火狐浏览器可以 load加载,并且自动提示错误,不用像IE那样手写抛出异常语句,但是load在火狐是默认异步的
var xmlDom = document.implementation.createDocument('', 'root', null);
xmlDom.async = true;
xmlDom.load("01 index.xml"); //xml文件名
xmlDom.onload = function() { //因为默认是异步,所以加了判断语句,判断是否加载完成,注意火狐中判断使用得是 .onload
var str = (new XMLSerializer()).serializeToString(xmlDom);
alert(str);
}
谷歌浏览器不可以load加载,不会自动提示错误
var parser = new DOMParser(),
xmlStr = "",
xmlDom = null;
try {
xmlStr = "<root><user>root</user></root>";
xmlDom = parser.parseFromString(xmlStr, 'text/xml');
var error = xmlDom.getElementsByTagName("parsererror");
if (error.length > 0) {
throw new Error("xml格式有误:" + error[0].innerText);
}
} catch(e) {
console.log(e)
}
各个浏览器的兼容处理,以下代码适应于 IE,谷歌,火狐
// 创建 xml
function parseXML(xml) {
var xmlDom = null;
//判断是否为 非IE 浏览器
if (typeof DOMParser != 'undefined') {
// 判断正确 创建对象
xmlDom = (new DOMParser()).parseFromString(xml, 'text/xml');
// 检测是否xml文档有没有问题
var error = xmlDom.getElementsByTagName("parsererror");
if (error.length > 0) {
throw new Error("XML格式有误:" + error[0].textContent);
}
//判断是否为 IE浏览器
} else if (typeof ActiveXObject != 'undefined') {
//调用了IE用于创建对象的方法
xmlDom = createXMLDom();
xmlDom.loadXML(xml);
if (xmlDom.parseError.errorCode != 0) {
throw new Error(
"错误的行号:"+xmlDom.parseError.line+"\n"+
"错误的位置:"+xmlDom.parseError.linepos+"\n"+
"错误的信息:"+xmlDom.parseError.errorCode+"\n"+
"错误的解释"+xmlDom.parseError.reason
)
}
} else {
throw new Error("NO XML available");
}
return xmlDom;
}
序列化(字符化)xml
// 序列化xml jDom
function serializerXML(xmlDom) {
if (typeof XMLSerializer != 'undefined') {
xml = (new XMLSerializer()).serializeToString(xmlDom)
} else if (typeof xmlDom.xml != 'undefined') {
xml = xmlDom.xml;
} else {
throw new Error("无法解析");
}
return xml;
}