javascript讀j寫xml檔案 ActiveObject(Msxml2.DOMDocument 對象使用)

來源:互聯網
上載者:User
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>

///////////////////////////////////////////////////////////
首先:xml檔案(tree.xml)內容如下:
<?xml version="1.0" encoding="gb2312"?>
<treeview>
<tree id="p1">
<text>山東省</text>
<target>_blank</target>
<title>省份</title>
<link></link>
<tree id="p1-1">
<text>威海市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
</tree>
<tree id="p1-2">
<text>煙台市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
<node id="p1-2-1">
<text>長夼村</text>
<target>_blank</target>
<title>鄉鎮</title>
<link>

http://www.baidu.com/</link>
</node>
</tree>
<node id="p1-3">
<text>富鎮</text>
<target>_blank</target>
<title>鄉鎮</title>
<link>http://www.baidu.com/</link>
</node>
</tree>

<tree id="p2">
<text>河北省</text>
<target>_blank</target>
<title>省份</title>
<link></link>
<tree id="p2-1">
<text>泊頭市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
<node id="p2-1-1">
<text>郊河</text>
<target>_blank</target>
<title>鄉鎮</title>
<link>http://www.baidu.com/</link>
</node>
</tree>
<tree id="p2-2">
<text>石家莊</text>
<target>_blank</target>
<title>城市</title>
<link></link>
</tree>
</tree>

<tree id="p3">
<text>浙江省</text>
<target>_blank</target>
<title>省份</title>
<link></link>
<tree id="p3-1">
<text>杭州市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
<node id="p3-1-1">
<text>某鎮</text>
<target>_blank</target>
<title>鄉鎮</title>
<link>http://www.baidu.com/</link>
</node>
</tree>
<tree id="p3-2">
<text>溫州市</text>
<target>_blank</target>
<title>城市</title>
<link></link>
<node id="p3-2-1">
<text>某鎮</text>
<target>_blank</target>
<title>鄉鎮</title>
<link>http://www.baidu.com/</link>
</node>
</tree>
</tree>
</treeview>
//////////////////////////////////////////////////////
然後:javascript函數實現:(檔案名稱:tree.htm)
<script Language="JavaScript">
var HTML = "";
var space = "";
var blank = " ";
function getSubject()
{
var xmlDoc;

if(window.ActiveXObject)
{
//獲得操作的xml檔案的對象
xmlDoc = new ActiveXObject('Microsoft.XMLDOM');
xmlDoc.async = false;
xmlDoc.load("tree.xml");
if(xmlDoc == null)
{
alert('您的瀏覽器不支援xml檔案讀取,於是本頁面禁止您的操作,推薦使用IE5.0以上可以解決此問題!');
window.location.href='/Index.aspx';
return;
}
}
//解析xml檔案,判斷是否出錯
if(xmlDoc.parseError.errorCode != 0)
{
alert(xmlDoc.parseError.reason);
return;
}
//獲得根接點
var nodes = xmlDoc.documentElement.childNodes;
//得到根接點下共有子接點個數,並迴圈
for(var i=0; i<nodes.length; i++)
{
//如果接點名為 tree
if(nodes(i).nodeName == "tree")
{
readTree(nodes(i));
}
//如果接點名為 node
else if(nodes(i).nodeName == "node")
{
readNode(nodes(i));
}
}
//刪除對象
delete(xmlDoc);
//顯示HTML
window.show.innerHTML = HTML;
return;
}
//讀Tree節點
function readTree(cI)
{
var nodes = cI.childNodes;
var menuHTML = space;
menuHTML += blank;
//得到超級連結
menuHTML += "<a href='";
//如果該節點的串連屬性不為空白,則串連
if(cI.selectNodes("link")(0).text != "")
{
menuHTML += cI.selectNodes("link")(0).text;
}
//否則為空白連結
else
{
menuHTML += "#";
}
//目標
if(cI.selectNodes("target")(0).text != "")
{
menuHTML += " target='"+cI.selectNodes("target")(0).text;
menuHTML += "'";
}
//點擊菜單事件,調用divshow(vid)函數
menuHTML += " onclick=javascript:divshow('"+cI.getAttribute("id")+"');";
//得到節點標題
menuHTML += " title='";
menuHTML += cI.selectNodes("title")(0).text;
//結束
menuHTML += "'>";
//得到節點的本文
menuHTML += cI.selectNodes("text")(0).text;
menuHTML += "</a><br>/n";
//將menuHTML設定添加到HTML字串
HTML += menuHTML;
//得到該節點的屬性值<span
HTML += "<div id='"+cI.getAttribute("id")+"' style='display:none'>/n";
for(var i=0; i<nodes.length; i++)
{
var tempImg = "";
tempImg += blank;
if(nodes(i).nodeName == "tree")
{
space += tempImg;
readTree(nodes(i));
space = "";
}
else if(nodes(i).nodeName == "node")
{
space += tempImg;
readNode(nodes(i));
}
}
HTML += "</div>/n";
return;
}
//讀Node節點
function readNode(cI)
{
var nodeHTML = space;
nodeHTML += blank;
//設定超級連結
nodeHTML += "<a href='";
//得到串連地址
nodeHTML += cI.selectNodes("link")(0).text;
//目標
if(cI.selectNodes("target")(0).text != "")
nodeHTML += "' target='"+cI.selectNodes("target")(0).text;
//得到節點標題
nodeHTML += "' title='";
nodeHTML += cI.selectNodes("title")(0).text;
//結束
nodeHTML += "'>";
//得到節點的本文
nodeHTML += cI.selectNodes("text")(0).text;
nodeHTML += "</a><br>/n";
HTML += nodeHTML;
//HTML += "<div id='"+cI.getAttribute("id")+"'>";
space = "";
return;
}
//操作對象的顯示還是隱藏效果
function divshow(vid)
{
if(document.all[vid].style.display == "none")
{
document.all[vid].style.display = "block";
}
else
{
document.all[vid].style.display = "none";
}
return;
}
</script>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>JS_XML</title>

<style type="text/css">
<!--
body
{
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
font-size: 9pt;
}
A
{
text-decoration:none;
font-family: "宋體";
font-size: 9pt;
COLOR:#000000;
}
-->
</style>

</head>
<body bgcolor="#EEEEEE" leftmargin="0" topmargin="0">
<div id=show></div>
</body>
<script>
getSubject()
</script>
</html>
//////////////////////////////////////////////////////////

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.