一、JSON
1、什么是JSON
一种轻量级的数据交换格式，主要用于跟服务器进行交换数据
（1）从服务器上读取JSON数据，将json数据转化成js对象，然后在网页中使用数据
（2）json数据结构：对象 数组
代码语言：javascript复制<body>
<script>
var json = {
data:{
students:[
{
name:'tom',
age:18,
skill:['sing','run']
},
{
name:'bob',
age:19,
skill:['study','swim']
}
]
}
}
//获取数组内容，可以用for遍历或each
console.log($.each(json.data.students,function(index,item){
console.log(index,item);
console.log(item.name);
}));
</script>
</body>
2、JSON.stringify()
json对象转成字符串
3、JSON.parse()
字符串【注意需要是标准的json字符串格式转成json】
代码语言：javascript复制<script>
var json = {
data:{
students:[
{
name:'tom',
age:18,
skill:['sing','run']
},
{
name:'bob',
age:19,
skill:['study','swim']
}
]
}
}
var str = JSON.stringify(json)
console.log(str);
var obj = JSON.parse(str)
console.log(obj);
</script>
二、AJAX（用户登录 - 天行数据TianAPI）
1、open(method,url,async)
method：请求类型（GET、POST）
url：接口地址
async:true（异步）、false（同步）
【接口基本上都是异步（可以同时进行）的】
2、请求类型：get和post
（1）相同：都可以跟服务器进行数据交互
（2）不同：
①传送方式：get是通过地址栏进行传输，post是通过报文传输
②传送长度：get的长度会被限制，post不限长度
③安全性：get安全性低，参数会暴露在地址栏，一般用于获取，post安全性高，一般可以传输数据
3、send(string)
发送请求【post情况下string写参数的地方】
4、参数传递
（1）get：在地址栏上，url后面拼接?key=value&key=value
（2）post：send(key=value)
5、响应
responseText属性：获取以字符串形式返回的数据
（1）Jscript的get写法：（天行的舔狗日记为例）
代码语言：javascript复制<script>
//创建
var xhr = new XMLHttpRequest()
xhr.open(
'GET',
'http://api.tianapi.com/tiangou/index?key=a3828b7efb833ce8c26d05f10ed40e04',
true
)
//发送
xhr.send()
//响应
xhr.onload = function(){
console.log(xhr.responseText);
var data = JSON.parse(xhr.responseText)
console.log(data);
}
</script>
（2）Jscript的post写法：
代码语言：javascript复制<script>
var xhr = new XMLHttpRequest();
xhr.open(
"POST",
"http://120.78.172.212:7789/students/sys/loginWeb",
true
);
// 配置Content-Type： application/x-www-form-urlencoded
xhr.setRequestHeader(
"Content-Type",
"application/x-www-form-urlencoded",
"charset=UTF-8"
);
// 发送
xhr.send("username=lyx&password=888888");
// 响应
xhr.onload = function () {
console.log(xhr.responseText);
var data = JSON.parse(xhr.responseText);
console.log(data);
};
</script>
（3）JQ的get写法：
代码语言：javascript复制<script>
$.ajax({
async:true,
type:'GET',
url:'http://api.tianapi.com/tianqi/index?key=408065bffbb866c9782f501d3ff046bf&city=福州市',
success:function(res){
console.log(res);
}
})
</script>
（4）JQ的post写法：
代码语言：javascript复制<script>
$.ajax({
async:true,
type:'POST',
data:{
key:'a3828b7efb833ce8c26d05f10ed40e04'
},
url:'http://api.tianapi.com/tiangou/index',
success:function(res){
console.log(res);
}
})
</script>
