AJAX基礎知識總結
阿新 • • 發佈：2018-11-12
目錄
基於AJAX的非同步處理（AJAX採用非同步方式與後臺互動）：
例2.使用get方法和POST方法向伺服器傳送引數：https://blog.csdn.net/qq_40323256/article/details/83933005
AJAX（Asynchronous JavaScript and XML）它是一種由多種技術組合的技術。 包括Javascript、XHTML和CSS、DOM、XML和XSTL、XMLHttpRequest 等。
XHTML，CSS用於呈現
DOM實現動態顯示和互動
XML和XSTL進行資料交換與處理
XMLHttpRequest物件用於進行非同步資料讀取
Javascript繫結和處理所有資料
通過 AJAX，JavaScript 可使用 JavaScript 的 XMLHttpRequest 物件來直接與伺服器進行通訊。通過這個物件，JavaScript 可在不過載頁面的情況與 Web 伺服器交換資料。
AJAX 在瀏覽器與 Web 伺服器之間使用非同步資料傳輸（HTTP 請求），這樣就可使網頁從伺服器請求少量的資訊，而不是整個頁面。
AJAX工作原理圖：
基於AJAX的非同步處理（AJAX採用非同步方式與後臺互動）：
基於AJAX的非同步載入過程
XMLHttpRequest的方法：
XMLHttpRequest的屬性：
建立XMLHttpRequest物件：
var xmlhttp;
if (window.XMLHttpRequest)//code for IE7+ ,FireFox,chrome,opera,safari
{
xmlhttp = new XMLHttpRequest();
}
else
{//code for IE5,6
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}例1.
HtmlPage1.html
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)//code for IE7+ ,FireFox,chrome,opera,safari
{
xmlhttp = new XMLHttpRequest();
}
else
{//code for IE5,6
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
//xmlhttp.onreadystatechange = callback;
//function callback() {
// if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
// document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
// }
//}
xmlhttp.onreadystatechange = function ()
{
alert("xmlhttp.readyState:" + xmlhttp.readyState);
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
{
document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET", "WebForm1.aspx", true);
xmlhttp.send();
}
</script>
</head>
<body>
<input id="Button1" type="button" value="請求資料" onclick="loadXMLDoc()" /> <div id="myDiv"> </div>
</body>WebForm1.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
Response.Expires = -1;
string a = "請求時間";
System.DateTime currentTime = new System.DateTime();
currentTime = System.DateTime.Now;
a = a + currentTime;
Response.Write(a);
}