<!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>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>jquery ajax 載入xml文檔</title>
<script language="網頁特效">
$.ajax({
//這個是萬能的,不單單可以讀xml
url:'i.xml', //xml文檔路徑
type:'get', //請求方式
datatype:'xml',//文件類型
timeout:1000,//逾時時間長度
cache:false,//是否緩衝
error:function(){alert('oh,oh,error!haha!');},//這個是拋出載入失敗的資訊,比js的智能吧
success:function(xml){
alert('yeah! success!');//在這裡執行對xml文檔內容的操作
}
});
//更簡潔的方法
$.get('i.xml',function(xml){
alert('yeah! success!');//在這裡執行對xml文檔內容的操作
});
</script>
方法二
<script type="text/javascript">
$(function(){
$("#ajax").one('click',function(){
//$("#ajax").nextall().remove();
$.ajax({
url: 'ajax.xml',
//data: {id: 1, name: 0},
datatype: 'xml',
error: function(xml){
alert('載入出錯');
},
success: function(xml){
var tr='';
$(xml).find("row").each(function(i){
var id=$.trim($(this).children("id").text()); //取對象
var v1=$(this).attr('v1');
var v2=$(this).attr('v2');
var v3=$(this).attr('v3');
var v4=$(this).attr('v4');
var v5=$(this).attr('v5');
//最後麼輸出了
$('<tr></tr>')
.html('<td>id:'+id+'</td><td>v1:'+v1+'</td><td>v2:'+v2+'</td><td>v3:'+v3+'</td><td>v4:'+v4+'</td><td>v5:'+v5+'</td>')
.appendto("#list");
});
//var tabl= '<table bgcolor="#ffffff" border="0" cellpadding="1" cellspacing="1" width="100%">';
// var tab2= '</table>';
//$("#list").html(tabl + tr + tab2);
}
})
});
$("#ajax").click(function(){$(this).nextall().toggle();});
$("#t1").click(function(){$(this).next().toggle();});
})
</script>
</head>
<body>
</body>
</html>
很多時候無法解析就是content-type的問題。如果本身就是xml檔案,請跳過這一步。
動態產生的xml一定要將其設定為text/xml,否則預設就是text/html也就是普通的文本。 常見語言的content-type設定:
response.setheader("contenttype","text/xml"); //jsp教程
response.contenttype= "text/xml"; //asp教程
header("content-type:text/xml"); //php教程