<html>
<head>
<title>ajax讀取資料到表格</title>
</head>
<body>
<input type="button" value="顯示資料" onclick="post()" />
<script type="text/網頁特效">
function ajax_xmlhttp(){
//在ie中建立xmlhttprequest,適用於ie5.0以上所有版本
var msxmlhttp = new array("msxml2.xmlhttp.5.0","msxml2.xmlhttp.4.0","msxml2.xmlhttp.3.0","msxml2.xmlhttp","microsoft.xmlhttp");
for(var i=0; i<msxmlhttp.length; i++){
try
{
_xmlhttp=new activexobject(msxmlhttp[i]);
}
catch(e)
{
_xmlhttp=null;
}
} //迴圈建立基於ie瀏覽器的xmlhttp.結束
//如果非ie瀏覽器，則建立基於firefox等瀏覽器的xmlhttprequest
if(!_xmlhttp && typeof xmlhttprequest != "undefined")
{
_xmlhttp=new xmlhttprequest();
}
return _xmlhttp;
}//發送請求函數
function post(){
var ajax = ajax_xmlhttp(); //將xmlhttprequest對象賦值給一個變數．
ajax.open("post","web_ajax.asp教程",true);//佈建要求方式，請求檔案，非同步請求
ajax.onreadystatechange = function(){//你也可以這裡指定一個已經寫好的函數名稱
if(ajax.readystate==4){//資料返回成功
if(ajax.status==200){//http請求狀態代碼返回ok
var xmldata = ajax.responsexml;//接收返回xml格式資料
var read = xmldata.getelementsbytagname("read");//擷取所有的read標籤
if(read.length!=0){
var t = document.createelement("table");//建立一個表格元素
t.setattribute("border","1");
document.body.appendchild(t);//將表格添加到doby內
for(var i=0;i<read[0].childnodes.length;i++){
var tr = t.insertrow(t.rows.length);//添加一行
var td = tr.insertcell(0);//添加一列
td.innerhtml = read[0].childnodes[i].firstchild.nodevalue;//為儲存格寫入常值內容
}
}
}
}
}
ajax.send(null);
}
</script>
</body>
</html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
