本文介绍了一个用于简化XML操作的JavaScript封装类。该类通过检测浏览器类型，兼容IE的ActiveXObject与非IE标准的DOMParser，实现了从字符串加载XML、从URL获取XML、解析节点路径及获取节点值等功能。文中提供了完整的封装代码及具体的调用DEMO，展示了如何处理XML数据并提取所需信息，适用于需要在前端进行XML数据处理的场景。
XML封装类核心实现
具体实现代码如下所示：
function XMLObject() {
{
this.isIE = true;
if (window.ActiveXObject) { isIE = true; } else { isIE = false; }
var node_xml;
var xmlDoc;
if (isIE) {
xmlDoc = new ActiveXObject("Msxml2.DOMDocument");
}
} else {
if (document.implementation && document.implementation.createDocument) {
xmlDoc = document.implementation.createDocument("", "", null);
}
}
xmlDoc.async = false;
xmlDoc.resolveExternals = false;
xmlDoc.validateOnParse = false;
xmlDoc.preserveWhiteSpace = true;
// 从字符串创建XML对象（接收XML字符串参数）
this.LoadXMLForString = function (XMLStr) {
{
if (isIE) {
{
xmlDoc.loadXML(XMLStr);
}
} else {
{
var oParser = new DOMParser();
xmlDoc = oParser.parseFromString(XMLStr, "text/xml");
}
}
// 从外部文件创建XML对象（接收文件路径参数）
this.getXMLForURL = function (url) {
{
// xmlDoc.load(url);
if (isIE) {
xmlDoc.load(url);
}
} else {
{
xmlDoc = getXML(url).responseXML;
}
}
// 获取指定路径下的节点数组
this.getXMLArray = function (name) {
var keys = name.split('.');
var node = xmlDoc.documentElement; // 获取根节点
var rtn = new Array();
var n = 0;
for (var i = 0; i < keys.length; i++) {
var childs = node.childNodes; // 获取子节点列表
var key = keys[i];
for (var k = 0; k < childs.length; k++) {
var child = childs[k];
if (child.nodeName == key) { // 判断子节点名称是否匹配
if (i == keys.length - 1) {
rtn[n] = child;
n++;
} else {
node = child;
break;
}
}
}
}
node_xml = rtn;
return rtn;
}
// 获取指定节点的文本值
this.getNodeValue = function (name) {
{
return this.getValue(xmlDoc, name);
}
// 根据节点对象获取其下子节点的内容
this.getValue = function (node, name) {
{
var keys = name.split('.');
for (var i = 0; i < keys.length; i++)
{
var childs = node.childNodes; // 获取子节点列表
var key = keys[i];
for (var k = 0; k < childs.length; k++)
{
var child = childs[k];
if (child.nodeName == key)
{ // 判断子节点名称是否匹配
if (child.childNodes.length == 1)
{
// 若无子节点，则返回文本值
if (!window.ActiveXObject)
{
return childs[k].textContent;
}
else
{
return childs[k].text
}
}
} else {
{
// 若还有子节点，继续向下分析
node = child;
break;
}
}
}
}
return "";
}
function GetXMLHTTP() {
{
var xmlhttp;
if (window.ActiveXObject) {
try { xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); }
catch (e) { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); }
} else if (window.XMLHttpRequest)
{ xmlhttp = new XMLHttpRequest(); }
return xmlhttp;
}
function getXML(url) {
var xmlHttp = GetXMLHTTP();
if (xmlHttp != null) {
xmlHttp.open("GET", url, false);
xmlHttp.send(null);
} else {
alert("Your browser does not support XMLHTTP.11");
return false;
}
return xmlHttp;
}
} XML操作调用示例
调用方法DEMO
具体调用代码如下：
var strXML = "<?xml version='1.0' encoding='utf-8'?><ekuy><user><name><cnname>小猪</cnname></name><age>27</age></user><user><name><cnname>小霞</cnname></name><age>26</age></user><user><name><cnname>小章</cnname></name><age>25</age></user></ekuy>";
var XMLObj = new XMLObject();
XMLObj.LoadXMLForString(strXML)
// XMLObj.getXMLForURL("test.xml");
var list = XMLObj.getXMLArray('user'); // 获取节点数组
document.write(XMLObj.getNodeValue('ekuy.user.name.cnname')); // 直接获取节点内容
// 循环节点，获取节点下子节点内容
for (var i = 0; i < list.length; i++) {
var obj = list[i];
document.write(XMLObj.getValue(obj, 'name.cnname'));
document.write(XMLObj.getValue(obj, 'age'));
document.write('<br\/>');
} 代码功能较为简单，仅供参考。