版权声明:本文为博主原创文章,遵循 CC 4.0 BY 版权协议,转载请附上原文出处链接和本声明。
文章目录
PS:由于生命宝贵,我并不想把大把时间花在处理浏览器的兼容性上,所有兼容都基于Webkit,不对其他内核或者浏览器进行兼容
AJAX概念
- 运用
HTML
和CSS
来实现页面,表达信息 - 运用
XMLHttpRequest
对象和web服务器进行数据的异步交换 - 运用
JavaScript
操作DOM
,实现动态局部刷新
XMLHttpRequest对象
创建XMLHttpRequest对象
var 变量 = new XMLHttpRequest();
发送XMLHttpRequest请求
request.open(method,url,async)
request.setRequestHeader('Content-type','application/x-www-form-urlencoded')//不发送文件的方式
request.send(string)
例:
request.open('POST','code.php',true)
request.setRequestHeader('Content-type','application/x-www-form-urlencoded')
request.send("namme=王二狗&sex=男")
获取XMLHttpRequest响应
respoinseText
:获得字符串形式的响应数据
respoinseXML
:获得XML
形式的响应数据
status
和statusText
:以数字和文本形式返回HTTP状态码
getAllResponseHeader()
:获取所有的响应报头
getResponseHeader()
:查询响应中的某个字段的值
readyState属性
0:请求未初始化,open
还没有调用
1:服务器连接已建立,open
已经调用
2:请求已接收(接收到头信息)
3:处理请求中(接收到响应主体)
4:请求已完成,且响应已就绪
使用readyState属性
readyState
属性从0-4会触发5次
request.onreadystatechange = function(){
//判断响应是否完成,请求是否成功
if(request.readyState==4 && request.status==200){
//代码
}
}
HTTP协议
HTTP
是一种无状态的协议
完整HTTP步骤
- 建立
TCP
连接 - 浏览器向服务器发送请求命令
- 浏览器发送请求头信息
- 服务器应答
- 服务器发送应答头信息
- 服务器向浏览器发送数据
- 服务器关闭
TCP
连接
HTTP请求
HTTP
请求的方法或动作(GET
,POST
)- 正在请求的
URL
- 请求头,包含客户端环境信息,身份验证信息等
- 请求体,请求正文,请求正文中包含客户提交的查询字符串信息,表单信息等
HTTP响应
- 一个数字和文字和文字组成的状态码,用来显示请求是成功还是失败
- 响应头,响应头也和请求头一样包含许多有用的信息,例如服务器类型、日期时间、内容类型和长度等
- 响应体,也就是响应正文
HTTP状态码
- 1XX:信息类,表示收到
web
浏览器请求,正在进一步的处理 - 2XX:成功,表示用户请求被正确接收
- 3XX:重定向,表示请求没有成功,客户必须采取进一步的动作
- 4XX:客户端错误,表示客户端提交的请求有错误
- Found,意味着请求中所引用的文档不存在
- 5XX:服务器错误,表示服务器不能完成对请求的处理
JSON基本概念
- JSON:JavaScript对象表示法(JavaScript Object Notation)
- JSON是存储和交换文本信息的语法,类似XML,它采用键值对的方式来组织,易于人们阅读和编写,同时也易于机器解析和生成
- JSON升级独立于语言的,也就是锁不管什么语言,都可以解析JSON,只需要按照JSON的规则来就行
JSON与XML比较
- JSON的长度和XML格式比起来很短小
- JSON读写的速度更快
- JSON可以使用JavaScript内建的方法进行解析,转换成JavaScript对象
JSON语法规则
JSON数据的书写格式
"名称":"值对"
JSON的值类型
- 数字(整数或浮点数)
- 字符串(在双引号中)
- 逻辑值(true,false)
- 数组(在方括号中)
- 对象(在花括号中)
- null
{
"列名":[
{"名称":"值对","名称":"值对","名称":"值对"},
{"名称":"值对","名称":"值对","名称":"值对"},
{"名称":"值对","名称":"值对","名称":"值对"}
]
}
JavaScript解析JSON
var 变量 = JSON.parse(JSON);