AJAX初探01

AJAX概念

概念：即"Asynchronous JavaScript And XML"

通过在后台与服务器进行少量数据交换，AJAX可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。（传统的网页（不使用AJAX）如果需要更新内容，必须重载整个网页页面或者使用iframe。）

AJAX写法

浏览器兼容

if(window.ActiveXObject){

           xmlHttp = new ActiveXObject("Micr0soft.XMLHTTP");

       }else if(window.XMLHttpRequest){

           xmlHttp = new XMLHttpRequest();

       }

状态码

readyState

存在XMLHTTPRequest的状态

0: 请求未初始化

1: 服务器连接已建立

2: 请求已接收

3: 请求处理中

4: 请求已完成，且响应已就绪

status

200: "OK"

404: 未找到页面

---

<button onclick="update()">数据更新</button>

<br/>

	<div id="dataArea">

   展示服务器返回的数据

	</div>

<script>

   function update() {

       var xmlHttp;

       if(window.ActiveXObject){

           xmlHttp = new ActiveXObject ("Micr0soft.XMLHTTP");//IE678 opera OLD 老旧浏览器

       }else if(window.XMLHttpRequest){

           xmlHttp = new XMLHttpRequest(); // 新浏览器

       }

       xmlHttp.open("","");//打开和服务器的链接

       // xmlHttp.open("获取方式（get / post）","文件名");

       xmlHttp.send("null");//send动作才是真正的给服务器按照上面open的url发送请求

       //  on (当) ready (准备) state (状态) change (改变)

       xmlHttp.onreadystatechange = function () {

           if(xmlHttp.readyState === 4&& xmlHttp.status === 2){

               document.getElementById("dateArea").innerHTML = xmlHttp.responseText;

           }

       }

   }

---