Ajax本质:在页面不刷新的情况下,利用XMLHttpRequest发送HTTP请求,可以看做JS的网络化
function vote(){ //1、创建XMLHttpRequest对象 var xhr = new XMLHttpRequest(); //2、打开连接,第一个参数表弟传值方式,第二个表示请求哪个页面进行处理,true表示异步,false表示同步 xhr = open('GET','./test.php',true); //3、发送请求 xhr.send(null); //4、输出返回值 alert(xhr.responseText); }
Ajax同步表示发送完请求之后,要等到xhr.responseText拿到返回值才执行第四步,而异步是执行完发送请求后,直接执行第四步,并不需要等待,也不关心xhr.responseText是否拿到返回值
如果使用异步方式,如何知道请求发送完成这个状态呢?这就需要使用onreadystatechange这个属性进行绑定回调函数了
xhr.onreadystatechange = function (){ alert('请求成功'); }
Ajax不能实现文件上传,因为其调用的XMLHttpRequest对象是属于JS的,但是出于安全考虑JS的对象不能访问本地文件
使用POST方式进行传值
function vote(){ //1、创建XMLHttpRequest对象 var xhr = new XMLHttpRequest(); //2、打开连接 xhr = open('POST','./test.php',true); //3、收集表单数据 var uname = document.getElementById('uname').value; var email = document.getElementById('email').value; //4、发送请求 xhr.setRequestHeader('content-type','application/x-www-form-urlencoded') xhr.send('username='+uname+'&email='=email); //5、输出返回值 alert(xhr.responseText); } Ajax返回类型值XML类型