自己收集总结的一些AJAX的数据请求;
1、原生JS的AJAX请求
var XHR=null;
if (window.XMLHttpRequest) {
// 非IE内核
XHR = new XMLHttpRequest();
} else if (window.ActiveXObject) {
// IE内核,这里早期IE的版本写法不同,具体可以查询下
XHR = new ActiveXObject("Microsoft.XMLHTTP");
} else {
XHR = null;
}
if(XHR){
XHR.open("GET", "url");
XHR.onreadystatechange = function () {
// readyState值说明
// 0,初始化,XHR对象已经创建,还未执行open
// 1,载入,已经调用open方法,但是还没发送请求
// 2,载入完成,请求已经发送完成
// 3,交互,可以接收到部分数据
// status值说明
// 200:成功
// 404:没有发现文件、查询或URl
// 500:服务器产生内部错误
if (XHR.readyState == 4 && XHR.status == 200) {
console.log(XHR.responseText);
}
};
XHR.send();
}
2、JQ的AJAX请求
$("#tijiao").click(function(){
$.ajax({
type:"GET",
url:"http://localhost/AJAX/test.php?name="+$("#name").val()+"&phone="+
$("#phone").val(),
dataType:"json",
success:function(data){
$("#success").html(data.msg);
},
error:function(){
alert("错误!!!");
}
})
})
3、VUE框架下的请求
this.$http.get('http://route.showapi.com/341-1', {
params: {
showapi_appid: 26444,
showapi_sign: 'e6ed68d43d734b78892a649fedd90cbe'
}
}).then(function(res) {
// console.log(res);
var data = res.data;
if (data && data.showapi_res_code === 0) {
that.list = data.showapi_res_body.contentlist
} else {
that.errormsg = data.showapi_res_error;
}
}, function(error) {
that.errormsg = '网络异常,请稍候重试!!!'
})
4、react框架下的请求
var id=this.props.match.params.id;
$.get('http://localhost:8080/details?id='+id, function(res) {
var arr=JSON.parse(res);
})