AJAX— 异步传输

AJAX异步传输

AJAX— 异步传输

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

AJAX处理过程分为四步:

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

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

3.异步发送XMLHttpRequest请求

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

 

AJAX异步代码

 

1.创建ajax.js文件

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

 

2.创建index.php

  1. "text/javascript" src="ajax.js" mce_src="ajax.js">  
  2. "#" mce_href="#" οnclick="ajax('a')">a  
  3. "#" mce_href="#" οnclick="ajax('b')">b  
  4. "#" mce_href="#" οnclick="ajax('c')">c  
  5. "show">
  

 

3.建show.php

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

 

转载于:https://www.cnblogs.com/bethel511/p/3805387.html

你可能感兴趣的:(AJAX— 异步传输)