【www.bbyears.com--js教程】
word-wrap: break-word; margin: 5px 0px; color: rgb(0, 0, 0); font-family: 'sans serif', tahoma, verdana, helvetica; font-size: 13.3333px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 20px; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: 1; word-spacing: 0px; -webkit-text-stroke-width: 0px;">实例如下:
代码如下
// 使用原生js 封装ajax
// 兼容xhr对象
functioncreateXHR(){
if(typeofXMLHttpRequest !="undefined"){// 非IE6浏览器
returnnewXMLHttpRequest();
}elseif(typeofActiveXObject !="undefined"){ // IE6浏览器
varversion = [
"MSXML2.XMLHttp.6.0",
"MSXML2.XMLHttp.3.0",
"MSXML2.XMLHttp",
];
for(vari = 0; i < version.length; i++){
try{
returnnewActiveXObject(version[i]);
}catch(e){
//跳过
}
}
}else{
thrownewError("您的系统或浏览器不支持XHR对象!");
}
}
// 转义字符
functionparams(data){
vararr = [];
for(variindata){
arr.push(encodeURIComponent(i) +"="+ encodeURIComponent(data[i]));
}
returnarr.join("&");
}
// 封装ajax
functionga_ajax(obj){
varxhr = createXHR();
obj.url = obj.url +"?rand="+ Math.random();// 清除缓存
obj.data = params(obj.data); // 转义字符串
if(obj.method ==="get"){ // 判断使用的是否是get方式发送
obj.url += obj.url.indexOf("?") =="-1"?"?"+ obj.data :"&"+ obj.data;
}
// 异步
if(obj.async ===true){
// 异步的时候需要触发onreadystatechange事件
xhr.onreadystatechange =function(){
// 执行完成
if(xhr.readyState == 4){
callBack();
}
}
}
xhr.open(obj.method,obj.url,obj.async);// false是同步 true是异步 // "demo.php?rand="+Math.random()+"&name=ga&ga",
if(obj.method ==="post"){
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xhr.send(obj.data);
}else{
xhr.send(null);
}
// xhr.abort(); // 取消异步请求
// 同步
if(obj.async ===false){
callBack();
}
// 返回数据
functioncallBack(){
// 判断是否返回正确
if(xhr.status == 200){
obj.success(xhr.responseText);
}else{
obj.Error("获取数据失败,错误代号为:"+xhr.status+"错误信息为:"+xhr.statusText);
}
}
}
varhtml = document.getElementsByTagName("html")[0];
html.onclick =function(){
ga_ajax({
"method":"post",
"url":"demo.php",
"data": {
"name":"gao",
"age": 100,
"num":"12346&598"
},
"success":function(data){
alert(data);
},
"Error":function(text){
alert(text);
},
"async":false
});
}
以上这篇利用原生js写ajax实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持本网站。