JS操作XML

最新推荐文章于 2024-06-24 15:51:31 发布

tomato0402

最新推荐文章于 2024-06-24 15:51:31 发布

阅读量1.1k

点赞数

分类专栏： Ajax 文章标签： xml javascript function 浏览器 firefox null

本文链接：https://blog.csdn.net/tomato0402/article/details/1576777

版权

Ajax 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

//创建一个dom对象
function xml(str){
if(window.DOMParser)//firefox内核的浏览器
{
var p = new DOMParser();
return p.parseFromString( str, "text/xml" );
}
else if( window.ActiveXObject )//ie内核的浏览器
{
var doc = new ActiveXObject( "Msxml2.DOMDocument" );
doc.loadXML(str);
return doc;
}
else
return false;
}
</script>

........................

if(!!document.all)
{
alert('当前浏览器为IE,IE兼容');
}
else
{
alert('当前浏览器为FireFox,FireFox兼容');
}

-------

一般情况下，将数据放到一个节点的属性上，这样最容易操作，

例如xml格式为：

如果得到photo节点后，可以如下操作：

node.getAttribute(''attr1'');

这样可以得到属性的值。

第二种情况，如果是放入的节点之间，比如:

<photo>这是我的照片</photo>

这样可以用node.firstChild.data来获取数据，其中photo之间的内容被看作一个文本节点，因此必须用firstChild首先得到这个节点后，然后取其data信息。

第三种情况，如果信息包含一个html或者其他xml无法直接认识的内容，可以将其放入cdata中，这样js也可以很容易处理，跟第二种情况一样：xml代码如下：

<photo><![CDATA[<a href="这是我的照片的连接">这是我的照片</a>]]></photo>

-------------
<script language="JavaScript">
<!--
var doc = new ActiveXObject("Msxml2.DOMDocument"); //ie5.5+,CreateObject("Microsoft.XMLDOM")
doc.loadXML('<?xml version="1.0"?><students><name id="test"><firstname>王</firstname></name></students>');

var newnode = doc.createNode(1,"name","");
   var r = doc.createAttribute("id");    //创建属性
        r.value="test2";

        newnode.setAttributeNode(r); //添加属性

var newelement=doc.createElement("sex");//创建元素

var r1 = doc.createAttribute("id");    //创建属性
        r1.value="test2";
newelement.setAttributeNode(r1)
newnode.appendChild(newelement)
doc.lastChild.appendChild(newnode)
   alert(doc.xml)//添加一个子节点后的ｘｍｌ
currNode=doc.documentElement.childNodes.item(0);//
doc.documentElement.removeChild(currNode)//删除节点

alert(doc.xml)//删除后的ｘｍｌ

//-->
</script>

------------------
<script language="JavaScript">
<!--
var doc = new ActiveXObject("Msxml2.DOMDocument"); //ie5.5+,CreateObject("Microsoft.XMLDOM")

//加载文档
//doc.load("b.xml");

//创建文件头
var p = doc.createProcessingInstruction("xml","version='1.0' encoding='gb2312'");

//添加文件头
doc.appendChild(p);

//用于直接加载时获得根接点
//var root = doc.documentElement;

//两种方式创建根接点
// var root = doc.createElement("students");
var root = doc.createNode(1,"students","");

//创建子接点
var n = doc.createNode(1,"ttyp","");

        //指定子接点文本
        //n.text = " this is a test";

    //创建孙接点
    var o = doc.createElement("sex");
        o.text = "男";    //指定其文本

    //创建属性
    var r = doc.createAttribute("id");
        r.value="test";

//添加属性
n.setAttributeNode(r);

    //创建第二个属性
    var r1 = doc.createAttribute("class");
        r1.value="tt";

        //添加属性
        n.setAttributeNode(r1);

//删除第二个属性
n.removeAttribute("class");

//添加孙接点
n.appendChild(o);

//添加文本接点
n.appendChild(doc.createTextNode("this is a text node."));

        //添加注释
        n.appendChild(doc.createComment("this is a comment/n"));

        //添加子接点
        root.appendChild(n);

    //复制接点
    var m = n.cloneNode(true);

        root.appendChild(m);

        //删除接点
        root.removeChild(root.childNodes(0));

    //创建数据段
    var c = doc.createCDATASection("this is a cdata");
        c.text = "hi,cdata";
        //添加数据段
        root.appendChild(c);

    //添加根接点
    doc.appendChild(root);

    //查找接点
    var a = doc.getElementsByTagName("ttyp");
    //var a = doc.selectNodes("//ttyp");

    //显示改接点的属性
    for(var i= 0;i<a.length;i++)
    {
        alert(a[i].xml);
        for(var j=0;j<a[i].attributes.length;j++)
        {
            alert(a[i].attributes[j].name);
        }
    }

    //修改节点,利用XPATH定位节点
    var b = doc.selectSingleNode("//ttyp/sex");
    b.text = "女";

//alert(doc.xml);

    //XML保存（需要在服务端，客户端用FSO）
    //doc.save();

    //查看根接点XML
    if(n)
    {
        alert(n.ownerDocument.xml);
    }

//-->
</script>

-------------
<script language="javascript">
function window.onload()
{
var domXML=new ActiveXObject("Microsoft.xmldom");
domXML.load("Sele.xml");
var myRoot=domXML.documentElement;
var myNodes2=myRoot.childNodes;
var myNode2=myNodes2.nextNode();
var tableStr="";
for(var i=0;i<myNodes2.length;i++)
{
   myNodes3=myNode2.childNodes;
   myNode3=myNodes3.nextNode();
   tableStr=tableStr+"<tr>";

   for(var j=0;j<myNodes3.length;j++)
   {
    tableStr=tableStr+"<td width=100 bgcolor='#F3432A'>" + myNode3.text + "</td>";
    myNode3=myNodes3.nextNode();
   }
   myNode=myNodes2.nextNode();
   tableStr=tableStr + "</tr>";
}
tableStr="<table width=800 border=1><tr><td>CPU</td><td>内存</td><td>主板</td><td>硬盘</td></tr>" + tableStr + "</table>";
document.all.lideyongValue.innerHTML=tableStr;
}
</script>

-------------

首先,我们需要加载这个xml文件,js中加载xml文件,是通过XMLDOM来进行的.
// 加载xml文档
loadXML    = function(xmlFile)
{
    var xmlDoc;
    if(window.ActiveXObject)
    {
        xmlDoc    = new ActiveXObject('Microsoft.XMLDOM');
        xmlDoc.async    = false;
        xmlDoc.load(xmlFile);
    }
    else if (document.implementation&&document.implementation.createDocument)
    {
        xmlDoc    = document.implementation.createDocument('', '', null);
        xmlDoc.load(xmlFile);
    }
    else
    {
        return null;
    }

    return xmlDoc;
}

xml文件对象出来了, 接下去我就要对这个文档进行操作了.
比如说,我们现在需要得到节点Login/Weapon/W的第一个节点的属性,那么我们可以如下进行.

// 首先对xml对象进行判断
checkXMLDocObj    = function(xmlFile)
{
    var xmlDoc    = loadXML(xmlFile);
    if(xmlDoc==null)
    {
        alert('您的浏览器不支持xml文件读取,于是本页面禁止您的操作,推荐使用IE5.0以上可以解决此问题!');
        window.location.href='/Index.aspx';
    }

    return xmlDoc;
}

// 然后开始获取需要的Login/Weapon/W的第一个节点的属性值
var xmlDoc    = checkXMLDocObj('/EBS/XML/Login.xml');
var v    = xmlDoc.getElementsByTagName('Login/Weapon/W')[0].childNodes.getAttribute('Text')
而我在我的程序中的写法是这样子的,当然我在程序中的写法是已经应用到实际中的了.一并给出来,以供查看
initializeSelect    = function(oid, xPath)
{
    var xmlDoc    = checkXMLDocObj('/EBS/XML/Login.xml');
    var n;
    var l;
    var e    = $(oid);
    if(e!=null)
    {
        n    = xmlDoc.getElementsByTagName(xPath)[0].childNodes;
        l    = n.length;
        for(var i=0; i<l; i++)
        {
            var option    = document.createElement('option');
            option.value    = n[i].getAttribute('Value');
            option.innerHTML    = n[i].getAttribute('Text');
            e.appendChild(option);
        }
    }
}
上面的访问代码中,我们是通过xmlDoc.getElementsByTagName(xPath)来进行的.
还可以通过xmlDoc.documentElement.childNodes(1)..childNodes(0).getAttribute('Text')进行访问.
一些常用方法:
xmlDoc.documentElement.childNodes(0).nodeName,可以得到这个节点的名称.
xmlDoc.documentElement.childNodes(0).nodeValue,可以得到这个节点的值. 这个值是来自于这样子的xml格式:<a>b</b>, 于是可以得到b这个值.
xmlDoc.documentElement.childNodes(0).hasChild,可以判断是否有子节点