AJAX— 异步传输

AJAX异步传输

AJAX— 异步传输

AJAX浏览器与服务器异步传输数据，通过异步请求大大减少数据信息访问量，通俗：AJAX对局部刷新而不是对整个页面刷新，AJAX使得程序更快，更友好。

AJAX处理过程分为四步：

1.创建XMLHttpRequest,将目标URL设置在XMLHttpRequest

2.向XMLHttpRequest设置一个回调函数

3.异步发送XMLHttpRequest请求

4.服务器响应并调用回调函数把数据显示出来

AJAX异步代码

1.创建ajax.js文件

1. var xmlHttp;
2. function send_request() {
3. if(window.XMLHttpRequest) {
4. xmlHttp = new XMLHttpRequest();
5. } elseif(window.ActiveXObject) {
6. xmlHttp = new ActiveXObject("Micosoft.XMLHTTP");
7. }
8. }
9. function ajax(url) {
10. send_request();
11. xmlHttp.open("GET", "show.php?id="+url, true);
12. xmlHttp.onreadystatechange = processRequest;
13. xmlHttp.send(null);
14. }
15. function processRequest() {
16. var process = xmlHttp.responseText;
17. document.getElementById("show").innerHTML = process;
18. }

2.创建index.php

1. <mce:script type="text/javascript" src="ajax.js" mce_src="ajax.js"></mce:script>
2. <a href="#" mce_href="#" onclick="ajax('a')">a</a>
3. <a href="#" mce_href="#" onclick="ajax('b')">b</a>
4. <a href="#" mce_href="#" onclick="ajax('c')">c</a>
5. <div id="show"></div>

3.建show.php

1. <?php
2. if($str = $_GET['id']) {
3. for($i=0;$i<=10;$i++) {
4. echo $str;
5. }
6. }
7. ?>