js便籤筆記（8）——js載入XML字串或檔案

王福朋發表於2014-05-05
JS筆記XML字串

1. 載入XML檔案

方法1：ajax方式。程式碼如下：

var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
xhr.open("GET", "data.xml", false);
xhr.send(null);
var xmlDoc = xhr.responseXML;
console.log(xmlDoc);

（關於XMLHttpRequest物件的用法，請參加 http://www.w3school.com.cn/xmldom/dom_http.asp）

注意，程式碼第二行的“false”，表示不用非同步。如果這裡改為“true”，那麼xmlDoc將得到null。因為js的非同步操作，不會等待檔案載入完，就直接執行下面的語句了。所以，我們這裡必須設定為“false”，表示必須等待檔案載入完，再執行以下操作，這樣才能得到正確的xmlDoc。

這種方式相容所有高階瀏覽器，建議採用這種方式載入。

 

方法2：IE的方式。程式碼如下：

var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = "false";
xmlDoc.load("note.xml");
console.log(xmlDoc);

通過IE特有的ActiveXObject("Microsoft.XMLDOM")物件的load()方法載入檔案。

注意，這裡還是設定了非同步是false，原因和方法1的一樣。

 

方法3：Firefox的方式，程式碼如下：

var xmlDoc = document.implementation.createDocument("", "", null);
xmlDoc.async = "false";
xmlDoc.load("note.xml");
console.log(xmlDoc);

 

關於跨域載入：安全起見，現代瀏覽器不能跨域訪問，即只能載入本機上的xml檔案。

 

2. 載入XML字串

先看程式碼：

 1       function LoadXmlText() {
 2 
 3             //拼接XML字串
 4             var txt = '';
 5             txt = txt + "<note>";
 6             txt = txt + "<to>George</to>";
 7             txt = txt + "<from>John</from>";
 8             txt = txt + "<heading>Reminder</heading>";
 9             txt = txt + "<body>Don't forget the meeting!</body>";
10             txt = txt + "</note>";
11 
12             
13             if (window.DOMParser) {
14                 //非IE瀏覽器
15                 xmlDoc = (new DOMParser()).parseFromString(txt, "text/xml");
16             } else {
17                 //IE瀏覽器
18                 xmlDoc = new ActiveXObject("Microsoft.XMLDOM");         
19                 // 或者：xmlDoc = new ActiveXObject("MSXML2.DOMDocument");      
20 
21                 xmlDoc.async = "false";        //不啟用非同步，保證載入檔案成功之前不會進行下面操作
22                 xmlDoc.loadXML(txt);
23             }
24 
25             console.log(xmlDoc);
26         }

如果瀏覽器支援window.DOMParser物件，則直接用它的parseFromString()方法載入xml字串。

IE瀏覽器不支援window.DOMParser，則用loadXML()載入。

程式碼中註釋都寫的很親你清楚。

 

相關文章