Ajax基本原理

最新推荐文章于 2025-03-26 17:59:42 发布

原创最新推荐文章于 2025-03-26 17:59:42 发布

· 342 阅读

版权

 
  function 
  ajax 
  (method, 
  url, 
  data, 
  success) 
  { 
 
 
  var 
  xhr 
  = 
  null 
  ; 
 
 
  if 
  ( 
  window 
  . 
  XMLHttpRequest 
  ){ 
 
 
  xhr 
  = 
  new 
  XMLHttpRequest 
  (); 
 
 
  } 
  else 
  { 
 
 
  xhr 
  = 
  new 
  ActiveXObject 
  ( 
  "Microsoft.XMLHTTP" 
  ); 
 
 
  } 
 

 
  if 
  (method 
  == 
  "get" 
  && 
  data) 
  { 
 
 
  url 
  += 
  "?" 
  + 
  data; 
 
 
  } 
 
 
  xhr 
  . 
  open 
  (method, 
  url, 
  true 
  ); 
 

 
  if 
  (method 
  == 
  "get" 
  ) 
  { 
 
 
  xhr 
  . 
  send 
  (); 
 
 
  } 
  else 
  { 
 
 
  xhr 
  . 
  setRequestHeader 
  ( 
  "content-type" 
  , 
  "application/application/x-www-form-urlencoded" 
  ); 
 
 
  xhr 
  . 
  send 
  (data); 
 
 
  } 
 
 
 
 
  xhr 
  . 
  onreadystatechange 
  = 
  function 
  () 
  { 
 
 
  if 
  ( 
  xhr 
  . 
  readyState 
  == 
  4 
  ) 
  { 
 
 
  if 
  ( 
  xhr 
  . 
  status 
  == 
  200 
  ){ 
 
 
  success 
  && 
  success 
  ( 
  xhr 
  . 
  responseText 
  ); 
 
 
  } 
  else 
  { 
 

 
  } 
 
 
  } 
 
 
  } 
 
 
  } 
 

首先创建

function ajax(method, url, data, success) {
  var xhr = null;
  if(window.XMLHttpRequest){
    xhr = new XMLHttpRequest();
  }else{
    xhr = new ActiveXObject("Microsoft.XMLHTTP");
  }

  if(method == "get" &&data) {
    url += "?" + data;
  }
  xhr.open(method, url,true);

  if(method == "get") {
    xhr.send();
  }else {
    xhr.setRequestHeader("content-type", "application/application/x-www-form-urlencoded");
    xhr.send(data);
  }
  
  xhr.onreadystatechange = function() {
    if(xhr.readyState == 4) {
      if(xhr.status == 200){
        success && success(xhr.responseText);
      }else {

      }
    }
  }
}