继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

2017-03-27 AJAX笔记(学渣的忏悔)

学渣的忏悔
关注TA
已关注
手记 3
粉丝 1
获赞 33

JSON是一种数据存储的格式,准确来说,JSON是一个对象,数据通过键值对key:value的形式进行存储。
var obj={a:1,b:"abc",c:function...}
var json={"a":1,"b":"abc","c":"true"}

需要注意的,应为JSON只是用来存储数据,不具备程序的功能,所以value只能是数字,字符串和布尔值以及对象和数组。不能undefined和function
var json={"a":{b:10},"b":[1,2,3],c:1,d:"123",e:"true"}.

JSON中key值必须以字符串形式存在,并且只能是双引号.
不管是什么格式的数据存储方式,请求过来的只能字符串。
如:
var json={"a":1,"b":"abc"};
解析为: var json='{"a":1,b:"abc"}'

访问JSON内部的属性方法和访问对象属性的方法一直。都是通过.或者中括号加key来访问
var json={"a":1,"b":"abc"};
console.log(json["a"])
var json='{"a":1,"b":"abc"}';

console.log(eval("("+json+")"))可以用来解析字符串形式的JSON.但是因为安全和性能问题,不推荐使用

JOSN.parse:将字符串形式的JSON转化为对象形式的JSON。
var json='{"a":1}' ==> JSON.parse(json) => {"a":1}
var json='{"a":1}';
console.log(json)
console.log(JSON.parse(json))

JSON.stringify:跟JSON.parse相反,把对象形式的JSON转化为字符串形式的JSON
var json={"a":1} ==> JSON.stringify(json) => '{"a":1}'
var json={"a":1};
console.log(json)
console.log(JSON.stringify(json))

网路请求方式:http协议,tcp协议,ftp协议,file协议,数据请求的方式。
http请求:超文本传输协议,从www上传输超文本数据到本地浏览器.请求过来的只是一段数据。再通过浏览器内置的解析引擎进行数据的解析和页面的渲染.
http://www.baidu.com;

http:包括请求和相应,请求包括请求头,请求头,响应头,响应体。
请求:是浏览器通http到WWW进行DNS(万维网简称)寻址,并且发送数据请求。
响应:服务器通过http将数据返回给浏览器

通过url参数将需要请求的数据发送给服务器
请求类型:get post delete...常用的也是所有浏览器都支持是get post
联系:get和post都可以用来请求或者上传数据。

区别:
1.get方式上传数据,url会显示数据内容,暴露用户隐私。不安全。而post不会
2.get有长度限制,最大长度2048字节,相当于2k.而post没用限制
3.get请求数据会被浏览器缓存,而post不会

使用环境:获取数据使用get,上传数据使用post,如果请求数据体量较大,使用post

AJAX:asynchournous javascript and XML.异步的javascript和XML.Javascript语言与服务器进行异步交互.现在常见的是json而不是XML
AJAX可以请求一个的文本格式的文件。返回的是字符串。

同步和异步:
生活中:同步,同时进行多个活动。
异步,挨个挨个进行活动。
编程中:刚好跟生活中相反。同步,挨个挨个进行活动
异步才是同时进行多个活动
AJAX:通过xmlhttprequest请求,去请求服务器。IE6+支持。但是IE6不支持通用标准。有自己的标准,在写AJAX时注意兼容。IE8及以上支持通用标准,兼容主要处理IE67
XMLHttpRequest是JS的原生对象,可以直接实例化使用
打电话:
1.有个手机和号码
2.拨打号码,于通信商建立通信。
3.发送拨打电话的请求。
4.返回请求的结果,(建立通话成功,用户不在服务区,用户正忙,手机已停机,手机已关机...).
AJAX:
1.创建XMLHttpRequest对象。
2.跟服务器建立连接.
*/
//var xhr=new XMLHttpRequest(); //1.创建了XMLHQ对象
var xhr;
if(window.XMLHttpRequest){
xhr=new XMLHttpRequest()
}else{
xhr=new ActiveXObject("Microsoft.xmlhttp")
}
//2.建立服务器连接,并且告诉服务器要请求哪个文件。
xhr.open("get","data.txt",true);
//3.发送请求
xhr.send();
//4.处理服务器响应.判断请求连接状态
xhr.onreadystatechange=function(){ //准备状态改变时
//readyState有四个状态.4表示跟服务器建立连接成功
//status 服务器返回的数据状态,有五大种,200表示ok成功,300表示ok但是是缓存的。400表示文件丢失或者请求文件错误。500表示服务器问题
//服务器响应成功以后,通过responseText拿到返回的数据。字符串类型
if(xhr.readyState===4){
if(xhr.status===200){
console.log(xhr.responseText)
}else{
console.log(xhr.status)
}
}

}

打开App,阅读手记
3人推荐
发表评论
随时随地看视频慕课网APP