Ajax----學習（1）----js中的ajax
阿新 • • 發佈：2018-12-18
Ajax 作用：一種不用重新整理整個頁面便可以於伺服器通訊的方法。
Ajax工作原理：
Ajax非同步資料的讀取
Ajax資料格式：1.XML 2.JSON 3.HTML
3.傳遞HTML格式資料
3.1
3.2不必從 responseText 屬性中讀取資料。它已經是希望的格式，可以直接將它插入到頁面中。
3.3插入
例如：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>People at Clearleft</title>
<script type="text/javascript">
window.onload = function(){
var aNodes = document.getElementsByTagName("a");
for(var i = 0;i <aNodes.length;i++){
aNodes[i].onclick = function(){
var request = new XMLHttpRequest();
var method = "GET";
var url = this.href;
request.open(method, url);
request.send(null);
request.onreadystatechange = function(){
if(request.readyState == 4){
if(request.status == 200 || request.status == 304){
document.getElementById("details").innerHTML = request.responseText
}
}
}
return false;
}
}
}
</script>
<style type="text/css">
@import url("clearleft.css");
</style>
</head>
<body>
<h1>People</h1>
<ul>
<li>
<a href="files/andy.html">Andy</a>
</li>
<li>
<a href="files/richard.html">Richard</a>
</li>
<li>
<a href="files/jeremy.html">Jeremy</a>
</li>
</ul>
<div id="details"></div>
</body>
</html>