最全最详尽的Ajax2

一.数据类型(返回数据的处理)

xhr.responseText的返回是都是字符串,但有时候我们却需要数组类型,或者着json类型,实际后台可以传递一种伪数组,伪json的形式。但还是字符串如下例

1.['leo','Bob','Gati']     

2.["name":"leo"]               如果我们typeof会发现他们实际是字符串,所以我们需要将其转变为我们需要的json和数组。

高版本浏览器js为我们提供了一个对象JSON               但在ie7下没有这个对象需要我们手动下载引入  JSON.js 可以用条件注释

方法一 JSON.parse()             将格式写好的字符串转换成为JSON或者数组

var str = '{"name":"huangxiaojian","age":"23"}'

结果:

JSON.parse(str)

Object
    1. age"23"
    2. name"huangxiaojian"
    3. __proto__Object

当自己使用时候json的key值一定设为双引号否则报错

方法二 JSON.stringify()             将格式写好的字符串转换成为JSON或者数组

var a = {a:1,b:2}

结果:

JSON.stringify(a)

"{"a":1,"b":2}"

其实该对象还可以用于很多地方比如数组的深度遍历,想了解可以私信

像后端传输数据

get方式

url后面添加数据用&进行连接          

xhr.open('get','2.get.php?username=刘伟+'&age=30,true);

get两个问题

1.当我们修改后台数据,返回的值并没有改变。

原因:浏览器存在缓存解决方法连接一个动态字符串,产生不同地址,不同地址url不同,不会调用缓存。链接一个随机数或者时间

xhr.open('get','2.get.php?username=刘伟&age=30&' + new Date().getTime(),true);

2.你会发现中文乱码               

解决:编码呗

xhr.open('get','2.get.php?username='+encodeURI('刘伟')+'&age=30&' + new Date().getTime(),true);

post方式

xhr.open('post','2.post.php',true);
//post方式,数据放在send()里面作为参数传递
xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded');//申明发送的数据类型
post没有缓存问题      原因:post本就是用于向后台发消息
无需编码      

xhr.send('username=刘伟&age=30');

原文地址:https://www.cnblogs.com/LiSuSpAu/p/5732573.html