我是靠谱客的博主 眯眯眼小懒猪,最近开发中收集的这篇文章主要介绍原生ajax的实现,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

get方式请求

<script type="text/javascript"
/* 创建 XMLHttpRequest 对象 */ 
var xmlHttp; 
function GetXmlHttpObject(){ 
  if (window.XMLHttpRequest){ 
    // code for IE7+, Firefox, Chrome, Opera, Safari 
    xmlhttp=new XMLHttpRequest(); 
  }else{// code for IE6, IE5 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
  } 
  return xmlhttp; 
// -----------ajax方法-----------// 
function getLabelsGet(){ 
  xmlHttp=GetXmlHttpObject(); 
  if (xmlHttp==null){ 
    alert('您的浏览器不支持AJAX!'); 
    return
  } 
  var id = document.getElementById('id').value; 
  var url=""
  xmlHttp.open("GET",url,true);  //Boolean参数代表同步或异步
  xmlHttp.onreadystatechange=favorOK;//成功回调函数 
  xmlHttp.send(); //可传参数
}
function getOkGet(){ 
  if(xmlHttp.readyState==1||xmlHttp.readyState==2||xmlHttp.readyState==3){ 
    // 本地提示:加载中 
  } 
  if (xmlHttp.readyState==4 && xmlHttp.status==200){ 
    var d= xmlHttp.responseText;   //后台返回结果
    // 处理返回结果 
  } 
</script>


post方式请求

<script type="text/javascript"
/* 创建 XMLHttpRequest 对象 */ 
var xmlHttp; 
function GetXmlHttpObject(){ 
if (window.XMLHttpRequest){ 
// code for IE7+, Firefox, Chrome, Opera, Safari 
xmlhttp=new XMLHttpRequest(); 
}else{// code for IE6, IE5 
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
return xmlhttp; 
// -----------ajax方法-----------// 
function getLabelsPost(){ 
xmlHttp=GetXmlHttpObject(); 
if (xmlHttp==null){ 
alert('您的浏览器不支持AJAX!'); 
return
var url=""
xmlhttp.open("POST",url,true); 
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); post方式设置头  
xmlhttp.send(); 
xmlHttp.onreadystatechange=getLabelsOK;//成功回调函数  
function getOkPost(){ 
if(xmlHttp.readyState==1||xmlHttp.readyState==2||xmlHttp.readyState==3){ 
// 本地提示:加载中/处理中 
if (xmlHttp.readyState==4 && xmlHttp.status==200){ 
var d=xmlHttp.responseText; // 返回值 
// 处理返回值 
</script>


ajax状态值:(AJAX状态值是指,运行AJAX所经历过的几种状态,无论访问是否成功都将响应的步骤,可以理解成为AJAX运行步骤。使用“ajax.readyState”获得。对于成功访问的状态(得到信息)我们大多数采用“4”进行判断。
 0 - (未初始化)还没有调用send()方法
 1 - (载入)已调用send()方法,正在发送请求
 2 - (载入完成)send()方法执行完成,已经接收到全部响应内容
 3 - (交互)正在解析响应内容
 4 - (完成)响应内容解析完成,可以在客户端调用了

ajax状态码:(AJAX状态码是指,无论AJAX访问是否成功,由HTTP协议根据所提交的信息,服务器所返回的HTTP头信息代码,该信息使用“ajax.status”所获得;)
1**:请求收到,继续处理
2**:操作成功收到,分析、接受
3**:完成此请求必须进一步处理
4**:请求包含一个错误语法或不能完成
5**:服务器执行一个完全有效请求失败

最后

以上就是眯眯眼小懒猪为你收集整理的原生ajax的实现的全部内容,希望文章能够帮你解决原生ajax的实现所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(47)

评论列表共有 0 条评论

立即
投稿
返回
顶部