ajax讀取資料入門篇教程

來源:互聯網
上載者:User

ajax即“asynchronous 網頁特效 and xml”(非同步javascript和xml),ajax並非縮寫詞,而是由jesse james gaiiett創造的名詞,是指一種建立互動式網頁應用的網頁開發技術


ajax的概念中最重要而最易被忽視的是它也是一種javascript程式設計語言。javascript是一種粘合劑使ajax應用的各部分整合在一起。在大部分時間,javascript通常被服務端開發人員認為是一種企業級應用不需要使用的東西應該儘力避免。這種觀點來自以前編寫javascript代碼的經曆:繁雜而又易出錯的語言。類似的,它也被認為將應用邏輯任意地散布在服務端和用戶端中,這使得問題很難被發現而且代碼很難重用。在ajax中javascript主要被用來傳遞使用者介面上的資料到服務端並返回結果。xmlhttprequest對象用來響應通過http傳遞的資料,一旦資料返回到用戶端就可以立刻使用dom將資料放到網面上。
xmlhttprequest
  xmlhttprequest對象在大部分瀏覽器上已經實現而且擁有一個簡單的介面允許資料從用戶端傳遞到服務端,但並不會打斷使用者當前的操作。使用xmlhttprequest傳送的資料可以是任何格式,雖然從名字上建議是xml格式的資料。   開發人員應該已經熟悉了許多其他xml相關的技術。xpath可以訪問xml文檔中的資料,但理解xml dom是必須的。類似的,xslt是最簡單而快速的從xml資料產生html或xml的方式。許多開發人員已經熟悉xpath和xslt,因此ajax選擇xml作為資料交換格式是有意義的。xslt可以被用在用戶端和服務端,它能夠減少大量的用javascript編寫的應用邏輯。
css教程
  為了正確的瀏覽ajax應用,css是一種ajax開發人員所需要的重要武器。css提供了從內容中分離應用樣式和設計的機制。雖然css在ajax應用中扮演至關重要的角色,但它也是構建跨瀏覽器應用的一大阻礙,因為不同的瀏覽器廠商支援各種不同的css層級。
伺服器端
  但不像在用戶端,在服務端ajax應用還是使用建立在如java,.net和php教程語言基礎上機制;並沒有改變這個領域中的主要方式。   既然如此,我們對ruby o n rails架構的興趣也就迅速增加了。在一年多前,ruby o n rails已經吸引了大量開發人員基於其強大功能來構建web和ajax應用。雖然目前還有很多快速應用開發工具存在,ruby o n rails看起來已經儲備了簡化構建ajax應用的能力。


<html>
<head>
<title>建立一個可用的xmlhttpreuqest對象</title>
</head>
<body>
<div id="str"></div><!--請求回來的資料將顯示在該div中-->
<input type="button" value="顯示資料" onclick="post()" />
<script type="text/javascript">
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;
var msg = xmldata.getelementsbytagname("msg");//擷取所有的msg元素
var data = msg[0].firstchild.nodevalue;
document.getelementbyid("str").innerhtml = data;
}
}
}
ajax.send(null);
}
</script>
</body>
</html>

web.asp檔案


<%
'作者:康董
'如需轉載請務必保留以上資訊
'定義一個變數,來儲存xml資料
dim xml
xml = "<?xml version='1.0' encoding='gb2312'?><body>"
xml = xml&"<msg>一個簡單的asp輸出xml的樣本,以後在我們的ajax教程執行個體中,我們都將使用該檔案進行資料的讀取操作</msg>"
xml=xml&"</body>"
response.clear
response.contenttype="text/xml"
response.charset="gb2312"
response.write xml
response.end
%>

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.