一、load方法：
<script src="./jquery-3.2.1.js" charset="utf-8"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#content').load('./dat.html', function (data, status) {
if (status == 'error') {
$('#content').text('404，你要的页面去火星啦')
}
});
$('#content').load('./data.html .header,.header1', function (data) {
console.log(data);
})
//我们可以在请求的URL字符串后拼接一个选择器，使用空格隔开URL和选择器，这样当load方法
//把指定的数据请求下来后，会根据选择器匹配对应的标签，只把匹配上的标签拼接进DOM文档流。
//如果需要使用多个选择器作为过滤器，则多个选择器之间使用“，”隔开。
$('#content').load('./data.html?user=张三&pass=123 h1', function (data, status, xhr) {
console.log(xhr);
})
});
</script>
<body>
<div id="content">
</div>
</body>
load（）：由页面中的标签对象调用，该方法被用来加载存放在服务器中的静态文件（一般指html代码片段），当请求到这份文件后，会把文件中的数据拼接进调用的标签中。
- 参数一：必选
要引入的静态文件路径，字符串类型，如果要发送get请求则将请求参数拼接在路径后。 - 参数二：可选
使用post请求时，该参数放的是传递的数据，使用的是对象类型。 - 参数三：可选
请求结束时的回调函数（不管请求是否成功，都会触发该函数）；
回调函数中有两个参数：在请求成功时，第一个参数保存的是请求到的数据，第二个参数保存的是“success”字符串；在请求失败时，第一个参数保存的是失败原因，第二个参数保存“error”字符串。我们可以根据第二个参数内容，判断该次请求是否成功。第二个参数总共有四个状态： - success：数据从服务器成功获取到；
- error：因为服务器响应了错误码。导致数据无法获取到；
- notmodified：数据从缓存中获取到；
- timeout：因为超时，数据无法获取到。
二、get和post方法：
//访问json数据
$.get('./data.json',{
user:'张三',
pass:'123456'
},function(data,status,xhr){
console.log(data);
console.log(status);
console.log(xhr);
});
//访问xml数据
$.get('./data.xml',{
user:'张三',
pass:'123456'
},function(data,status,xhr){
console.log(data);
console.log(status);
console.log(xhr);
});
get（）：发送get请求的方法。
get方法直接绑定在jQuery函数中，由$直接调用。
get（）方法中的参数：
- 参数一：必选，请求的接口地址（不能添加传递的参数）；
- 参数二：可选，接口所需的参数，对象类型；
- 参数三：可选，回调函数，只有在请求成功时才会触发；
回调函数中的三个参数：
1、请求下来的数据（json/xml），参数会根据请求接口类型转化数据，json转为object类型，xml自动转为DOM类型。
2、请求状态（success）。
3、发送当前get请求的请求对象。 - 参数四：可选，要求请求的接口返回该参数指定的数据类型（xml/json/script/text）；如果该接口有能力返回指定格式的数据，则返回，如果没能力，则请求失败，不触发回调函数。
post（）方法参数情况和get一致，返回数据也和get一致。
三、ajax方法：
ajax（）使用方法：
$.ajax({
method:"get",
url:"./data.json",
data:"user=zs&passwod=123",
success:function(data){
console.log(data);
},
error:function(err){
console.log(err);
},
async:true
});
ajax（）函数是jQuery中所有和ajax请求相关方法的底层方法，该方法内部封装的是原生ajax请求。
该方法的参数是对象类型。
- URL：接口字符串。
- data：接口参数字符串。
- method：请求方法字符串。
- success：当请求成功时执行的回调函数，该函数参数存放请求结果。
- error：当请求失败时执行的回调函数，该函数的参数存放ajax请求对象，可以通过该对象下的status、readyState属性值判断失败的原因。
使用jQuery中的ajax（）方法实现跨域：
$.ajax({
method:"get",
url:"http://10.0.156.213/data.php",
data:'cb=?',
dataType:'jsonp',
jsonp:'cb',
success:function(data){
console.log(data);
}
});
参数：
- url:要请求的跨域接口
- method：请求方法，ajax请求跨域接口用的是jsonp实现的，所以该值一定是get（可省）。
- data：请求的跨域接口参数，入股该接口不需要传参，则该属性和jsonp属性二选一即可；该属性值中包含一个回调函数字段，key是服务器指定的回调函数key,value是“？”
- dataType：告诉ajax方法，发送的请求是jsonp请求，而不是ajax请求，必须指定该属性值为“jsonp”
- jsonp：值是服务器指定的回调函数的key值（可以和data二选一存在）
- success：请求成功回调函数。
四、getJSON方法：
用法：
$.getJSON('http://10.0.156.213/data.php?cb=?',function(data){
console.log(data);
})
getJSON（）发送get请求，接受json数据
第一个参数：接口url（如果接口需要参数，则参数拼接在接口之后）。
第二个参数：回调函数，当请求成功时，触发回调函数，函数的第一个形参保存的是请求到的数据。
网友评论