|
|
系列文章導航：
JavaScript學習筆記一——數據類型
JavaScript學習筆記二——函數
JavaScript學習筆記三——作用域
JavaScript學習筆記四——Eval函數
JavaScript學習筆記五——類和對象
JavaScript學習筆記六：prototype的提出
Javascript學習筆記七——原型鏈的原理
Javascript學習筆記八——用JSON做原型
Javascript學習筆記九——prototype封裝繼承
Javascript學習筆記十——網頁運行原理
Javascript學習筆記十一——包裝DOM對象
Javascript學習筆記十三——關于響應事件
Javascript學習筆記十二——Ajax入門
Ajax:Asynchronous Javascript And XML。寫個簡單的例子：
<body> <form id="form1" runat="server"> <div> <ASP:Label ID="LabelTime" runat="server">ASP:Label> div> form> <script type="text/Javascript"> if (!window.XMLHttpRequest) { window.XMLHttpRequest = function () { return new ActiveXObject("Microsoft.XMLHTTP"); }; } function UpdateClock() { var request = new XMLHttpRequest(); request.open("post", "TimeTest.ASPx", false); request.send(""); document.getElementById("LabelTime").innerText = request.responseText; } setInterval(UpdateClock, 1000); script>body>
而在另一個頁面寫下當前時間，這樣就形成了一個鐘表。
代碼很簡單，就是操縱一個XMLHttpRequest對象來獲取服務器時間，然后更新時間。上面的代碼在與服務器交互時，并沒有頁面整體刷新，而是局部刷新。
但是上面的代碼在request.open時，最后一個參數為false，表示發出的XMLHttpRequest是同步的，由于Javascript是單線程的，所以在等待請求的過程中，線程會被阻塞，如果請求時間過長，瀏覽器會停止響應。
雖然Javascript是單線程的，但是XMLHttpRequest具備異步處理請求的能力。代碼如下：
<body> <form id="form1" runat="server"> <div> <ASP:Label ID="LabelTime" runat="server">ASP:Label> div> form> <script type="text/Javascript"> if (!window.XMLHttpRequest) { window.XMLHttpRequest = function () { return new ActiveXObject("Microsoft.XMLHTTP"); }; } function AsynRequest() { var request = new XMLHttpRequest(); request.open("post", "TimeTest.ASPx", true); request.onreadystatechange = function () { if (request.readyState === 4) { UpdateClock(request.responseText); } }; request.send(""); } function UpdateClock(time) { document.getElementById("LabelTime").innerText = time; } setInterval(AsynRequest, 1000); script>body>
哎，沒有智能提示的日子真不好過。
it知識庫：Javascript學習筆記十二&mdash;&mdash;Ajax入門，轉載需保留來源！
鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。
