兼容IE和火狐、crome的返回XML文件內容

1、XML文件

num.xml

<?xml version="1.0" encoding="utf-8" ?>

<shows>

<show>

<name>blue</name>

<email>[email protected]</email>

</show>

<show>

<name>yellow</name>

<email>[email protected]</email>

</show>

<show>

<name>green</name>

<email>[email protected]</email>

</show>

</shows>

2、ajax.js

function getHttpObject()

{

var xhr = null;

if(window.XMLHttpRequest)

{

xhr = new XMLHttpRequest();

}else if(window.ActiveXObject)

{

xhr= new ActiveXObject("Msxml2.XMLHTTP");

}

return xhr;

}


function ajax(url,fnSucc,fnFail)

{

var oAjax = getHttpObject();

oAjax.open('GET',url,true);

oAjax.send();

oAjax.onreadystatechange = function()

{

if(oAjax.readyState == 4)

{

if(oAjax.status ==200)

{

//var contacts = JSON.parse(oAjax.responseText);


fnSucc(oAjax.responseXML);

}else

{

if(fnFail) fnFail(oAjax.status);

}

}

}

}

3、html文件

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta content="text/html; charset=utf-8;" http-equiv="Content-Type">

<title>讀取XML內容</title>

<script type="text/javascript" src="ajax_XML.js"></script>

<script type="text/javascript">

window.onload = function()

{

ajax('num.xml',function(str){

console.log(str);

/* var xmlRoot = str.documentElement;

var channel = xmlRoot.childNodes.item(0);

var itemlist = channel.childNodes;*/

//alert(str.firstChild[0].firstChild[0].firstChild[0].nodeValue);

var node = str.getElementsByTagName('show');

for(var i=0;i<node.length;i++)

{


if(window.XMLHttpRequest)

{

//ff crome 下利用textContent返回 <name>blue</name>z中的值.:node[i].getElementsByTagName('name')[0].textContent

alert(i+'name: '+node[i].getElementsByTagName('name')[0].textContent+' '+i+'email: '

+node[i].getElementsByTagName('email')[0].textContent);

}else if(window.ActiveXObject)

{

//ie下用text返回 <name>blue</name>z中的值.:node[i].childNodes[0].text

alert(i+'name: '+node[i].childNodes[0].text+' '+i+'email: '+node[i].childNodes[1].text);

}



}

});

}

</script>

</head>

<body>


</body>

</html>


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章