交互技术之AJAX

2022-08-21 22:00:08 阅读：174 来源： 互联网

标签：username function 网页交互技术 request AJAX var new

/*
*作者：呆萌老师
*☑csdn认证讲师
*☑51cto高级讲师
*☑腾讯课堂认证讲师
*☑网易云课堂认证讲师
*☑华为开发者学堂认证讲师
*☑爱奇艺千人名师计划成员
*在这里给大家分享技术、知识和生活
*各种干货，记得关注哦！
*vx：it_daimeng
*/

AJAX: Asynchronous Javascript And Xml (异步javascript 和xml ) 是指一种创建交互式网页应用的网页开发技术

作用: 通过在后台与服务器进行少量数据交换，ajax可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新

传统的网页，如果需要更新内容必须重载整个网页页面

核心对象: XMLHttpRequest

readyState的5种状态：　
　0 （未初始化）　　1 （正在装载）　　2 （装载完毕）　　3 （交互中）　　4 （完成）　　
所以只有当readyState=4时，一个完整的服务器响应已经收到了，函数才可以处理该响应。

创建异步通信对象方式1:

function createXMLHttp()    
{ 
var request;        
//var browse = navigator.appName;        
if(window.XMLHttpRequest)        
{            
request = new XMLHttpRequest();//ie7, ie8 ,其它    
}    
else        
{            

request = new ActiveXObject("Microsoft.XMLHttp");//ie6,ie7        
}            
return request;    
}    
var xhr = createXMLHttp();

方式2:
var request=new ActiveXObject("Msxml2.xmlhttp.3.0");

两种传值方式:

用get方式传中文需要用 encodeURI(username);将中文编码

 var a;
   function check()
   {
       a=new ActiveXObject("Msxml2.xmlhttp.3.0");

       a.open("GET","panduan.php?username="+form1.username.value,true);

       a.onreadystatechange=jieshou;

       a.send(null);
    }

   function jieshou()
   {
          if(a.readystate==4)
          {             
             document.getElementById("s1").innerHTML=a.responseText;
          }
   }

用post方式传值

var a;
   function check()
   {
           var username=form1.username.value;

       a=new ActiveXObject("Msxml2.xmlhttp.3.0");

       a.open("POST","panduan.php",true);

           a.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//必须有这句

       a.onreadystatechange=jieshou;

       a.send("username="+username);
    }

   function jieshou()
   {
          if(a.readystate==4)
          {             
             document.getElementById("s1").innerHTML=a.responseText;
          }
   }

标签：username,function,网页,交互技术,request,AJAX,var,new
来源： https://www.cnblogs.com/daimenglaoshi/p/16611143.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

交互技术之AJAX