Ajax的使用
Ajax的使用
注册界面案例详解
实现Ajax主要的类是XMLHttpRequest,四个步骤:
1、创建XMLHttpRequest对象
2、准备发送网络请
3、开始发送网络请求
4、指定回调函数
当前端界面需要从服务器获取数据的时候,其实就只要访问一个u地址,制定特定的参数即可。
模拟了页面的跳转,请求url
创建对象;
做兼容处理(IE6)
if 变量声明;else
准备发送
POST、GET请求(php接口文件)
返回数据字符串格式。
/* 根目录
./*当前目录
实例
Get
post
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded")
将字符串转换为对象
满足json格式
1、将Ajax请求改为同步请求。
open('get','./server/checkUsername.php?username='+uname,false)
出现:
第一:界面会卡顿,卡顿多长时间,取决于网络速度
第二:xhr.onreadystatechange的回调将不会被执行,需要修改代码后才能获取到数据,将回调去除即可。
同步异步的原理
js顺序向下执行,单线程;
事件队列,存储回调函数的“容器”,js执行完毕后才执行;
异步:单线程+事件队列。
浏览器并非单线程!改变值之后会触发这个方法的调用。
数据格式
XML
类似于html标签,取数类似于数组
JSON
类似于键值对,json.parse()转换为数组