這次準備使用JS來讀取XML做一個例子來熟悉下，一共使用了一下幾個技術：Json，array排序，讀取xml，下面我就貼出代碼：
第一部：我們需要學習如何判斷浏覽器的類型：
下面是幾個主流的浏覽器使用js的判斷方法
function getOs()
{
var OsObject = "";
if(navigator.userAgent.indexOf("MSIE")>0) {
return "MSIE";
}
if(isFirefox=navigator.userAgent.indexOf("Firefox")>0){
return "Firefox";
}
if(isSafari=navigator.userAgent.indexOf("Safari")>0) {
return "Safari";
}
if(isCamino=navigator.userAgent.indexOf("Camino")>0){
return "Camino";
}
if(isMozilla=navigator.userAgent.indexOf("Gecko/")>0){
return "Gecko";
}
}
通過以上方法，大家可以取出浏覽器的類型，根據浏覽器的不同類型，我們使用不同的方式來執行個體化對象：
下面就是我寫的所有代碼，大家可以參考下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JS讀取XMLDemo</title>
<script language="javascript" type="text/javascript">
function NewInfoAction()
{
var dom;
var type=1; //預設為IE浏覽器
var data = new Array(); //存儲實體的數組
if(navigator.userAgent.indexOf("MSIE")>0)
{
dom = new ActiveXObject("Microsoft.XMLDOM"); //執行個體化dom對象
dom.async = false;
dom.load("NewInfo.xml"); //加載xml檔案
window.alert('IE');
}
else if(isFirefox=navigator.userAgent.indexOf("Firefox") > 0)
{
type=2;
dom = document.implementation.createDocument("", "", null); //火狐不支援ActiveXObject
dom.async = false;
dom.load("NewInfo.xml");
}
else
{
window.alert('暫不識别該浏覽器!');
return;
}
if(dom)
{
var node;
if(type == 1) //判斷是否為IE浏覽器
{
node = dom.documentElement.childNodes; //這裡的node大家可以了解為net中的表,友善大家了解
for(var i=0;i<node.length;i++)
{
var title = node[i].childNodes[0].text; //取出i行中的字段的值，大家這樣了解更友善
var content = node[i].childNodes[1].text;
var date = node[i].childNodes[2].text;
data.push({title:title,content:content,date:date}); //在這裡，我們使用使用json，把資料庫存儲在裡面
}
}
else
{
var node = dom.getElementsByTagName("News");
for(var i=0;i<node.length;i++)
{
// window.alert(dom.getElementsByTagName("News")[i].childNodes[1].textContent);
// window.alert(dom.getElementsByTagName("News")[i].childNodes[3].textContent);
// window.alert(dom.getElementsByTagName("News")[i].childNodes[5].textContent);
var value = dom.getElementsByTagName("News")[i].textContent.split(' ');
var title = value[4];
var content = value[8];
var date = value[12];
data.push({title:title,content:content,date:date}); //在這裡，我們使用使用json，把資料庫存儲在裡面
}
}
}
else
{
window.alert("dom對象為空，失敗了!");
return;
}
if(data.length != 0)
{
var shtml = '';
for(var i=0;i<data.length;i++)
{
shtml += '<div>';
shtml += '<div style="float:left; background-color:Red; width:80px; height:15px">';
shtml += data[i].title;
shtml += '</div>';
shtml += '<div>';
shtml += '<div style="float:left; background-color:Green;width:150px; height:15px">';
shtml += data[i].content;
shtml += '</div>';
shtml += '<div style="float:left; background-color:Green;width:120px; height:15px">';
shtml += data[i].date;
shtml += '</div>';
shtml += '</div>';
shtml += '</div>';
shtml += '<br/>';
}
document.getElementById('textDiv').innerHTML = shtml;
}
else
{
document.getElementById('textDiv').innerHTML = '沒有資訊!';
}
}
</script>
</head>
<body οnlοad="NewInfoAction()">
<div id="textDiv" >
</div>
</body>
</html>
一下是xml的檔案格式：
<?xml version="1.0" encoding="utf-8" ?>
<NewInfo>
<News>
<Title>今天要下雨</Title>
<Content>今天确實下雨了</Content>
<Date>2009-02-04</Date>
</News>
<News>
<Title>今天出太陽</Title>
<Content>今天确實出太陽了</Content>
<Date>2009-02-03</Date>
</News>
<News>
<Title>今天很無聊</Title>
<Content>今天确實很無聊</Content>
<Date>2009-02-02</Date>
</News>
</NewInfo>
![小程式自定義button元件擷取使用者資訊（使用者授權登入）[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)