原生JS写Ajax的请求函数功能
一般我们写网页的时候，如果用到Ajax请求服务器，都是使用JQuery等已经封装好的库来调用，比较简单。
但是一般这些库的功能很多，引入了太多我们用不到的东西，如果我们需要写一个功能单一，简单的页面，完全用不到引用如此庞大的库文件。
我们可以简单实现一个自己的Ajax请求功能，具体的代码如下：
varajax={};
ajax.x=function(){
if(typeofXMLHttpRequest!=='undefined'){
returnnewXMLHttpRequest();
}
varversions=[
"MSXML2.XmlHttp.6.0",
"MSXML2.XmlHttp.5.0",
"MSXML2.XmlHttp.4.0",
"MSXML2.XmlHttp.3.0",
"MSXML2.XmlHttp.2.0",
"Microsoft.XmlHttp"
];
varxhr;
for(vari=0;i=200&&status<300){
success&&success(x.responseText,x.responseXML)
}else{
fail&&fail(status);
}
}
};
if(method=='POST'){
x.setRequestHeader('Content-type','application/x-www-form-urlencoded');
}
x.send(data)
};
ajax.get=function(url,data,callback,fail,async){
varquery=[];
for(varkeyindata){
query.push(encodeURIComponent(key)+'='+encodeURIComponent(data[key]));
}
ajax.send(url+(query.length?'?'+query.join('&'):''),'GET',null,callback,fail,async)
};
ajax.post=function(url,data,callback,fail,async){
varquery=[];
for(varkeyindata){
query.push(encodeURIComponent(key)+'='+encodeURIComponent(data[key]));
}
ajax.send(url,'POST',query.join('&'),callback,fail,async)
};
使用方法：GET
ajax.get('/test.php',{foo:'bar'},function(response,xml){
//success
},
function(status){
//fail
});
POST
ajax.post('/test.php',{foo:'bar'},function(response,xml){
//succcess
},function(status){
//fail
});
这里需要注意一个问题，如果我们想要发送类似
varsendCmd="?op_code="+code+"&op_cmd="+cmd;
ajax.post('/control'+sendCmd,'',function(response,xml){
console.log('success');
},
function(status){
console.log('failed:'+status);
});
总结
以上所述是小编给大家介绍的原生JS写Ajax的请求函数功能，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对毛票票的支持！