一.Ajax
Ajax:AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。
这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
二.请求步骤
1.创建XMLHttpRequest对象
2.发送请求
3.响应
4.readyState
1.创建XMLHttpRequest对象
var xmlhttp=new XMLHttpRequest();
2.发送请求
GET:
xmlhttp.open("GET","test1.txt",true);
xmlhttp.send();//当send( “string”)-------只用于POST请求;
POST:
xmlhttp.open("POST","ajax_test.php", true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send("name=smyhvae&age=27");
open("请求类型","请求文件位置","请求是否异步(yrue) 同步(false)");
GET:请求参数在url连接中,长度有限制,参数只能是ASCI编码,中文需要url编码
POST:请求参数放在请求body中,长度并无限制,参数并不需要只能是ASCI编码
GET和POST的区别:http请求并不相同
-----GET:向服务器获取指定资源数据-----查询
-----POST:向服务器提交数据,数据放在请求中------修改
请记住,JavaScript 会等到服务器响应就绪才继续执行。如果服务器繁忙或缓慢,应用程序会挂起或停止。
3.响应
----responseText---获取字符串形式的响应数据
----responseXML----获得XML形式的响应数据
4.readyState
描叙XMLHttpRequest的状态
----0--请求未初始化,未调用open()
----1--服务器连接已经建立
----2--请求已经接收
----3--请求处理中
----4--请求已经完成,且响应已经就绪
status:状态码:
----200--返回正常
----304--服务器端资源无变化,可以使用缓存资源
----400--请求参数不合法
----401--未认证
----403--服务器端禁止访问该资源
----404--服务器端未找到该资源
----500--服务器异常
当请求发送到服务器时,我们需要执行一些基于响应的任务
当readyState发生改变时,将会触发onreadyStateChange函数事件
xmlhttp.onreadystateChange=function(){
if(xmlhttp.readyState==4 && xmlhttp.status==200){
alert("请求成功");
document.querySelector('h1').innerHTML = xmlhttp.responseText;
}
}
三.编译器打开的方式
注意:*********
必须用https协议方式打开,而不是通过file协议打开,
有的编译器默认打开模式为file协议,此时必须要通过安装插件或者通过编译器配备本地服务器,设置为https协议方式打开