一年都沒寫過博客了，不是懶，是不知有啥好寫的。。。現(xiàn)在本人從一個(gè)后臺開發(fā).net的轉(zhuǎn)向前端開發(fā)了。。。

之前去面試的時(shí)候，給面試官問過，有沒有屬于自己的ajax類，當(dāng)時(shí)很奇怪，因?yàn)槲一旧蟖jax開發(fā)都是用jquery來完成，后來想了想，也是應(yīng)該寫一個(gè)。

先看調(diào)用方式：

1?ajax.request("ajax.html",{v:Math.random(),num:1},function(data){
2?????//do?something
3?},'get');

?

?方式好像jquery哦。。。還是覺得這樣調(diào)用方便些。。。

?1?var?ajax?=?{
?2?????//Xmlhttprequest類
?3?????Xmlhttprequest?:function()?{
?4?????????this.xhr?=false;
?5?????},
?6?????//外部調(diào)用接口
?7?????request?:?function(url,data,callback,type)?{
?8?????????//每次都創(chuàng)建一個(gè)Xmlhttprequest的對象，使ajax調(diào)用互不影響
?9?????????var?xhr?=?new?this.Xmlhttprequest();
10?????????xhr.request(url,data,callback,type);
11?????}
12?}
13?//將{num:1,t:'a'}這種json數(shù)據(jù)格式轉(zhuǎn)為num=1&t=a這種字符串形式
14?var?json2str?=?function(data){
15?????var?_data?=?[];
16?????
17?????for(var?name?in?data)?{
18?????????_data.push(name+"="+data[name]);
19?????}
20?????return?_data.join('&');
21?}
22?//擴(kuò)展Xmlhttprequest類的方法
23?ajax.Xmlhttprequest.prototype?=?{
24?????//創(chuàng)建XMLHttpRequest
25?????createXmlHttpRequest?:?function(){
26?????
27?????????if(window.XMLHttpRequest)?{
28?????????????return?new?XMLHttpRequest();
29?????????}
30?????????else?{
31?????????????var?a?=?["Msxml2.XMLHTTP","Microsoft.XMLHTTP","Msxml2.XMLHTTP.5.0","Msxml2.XMLHTTP.4.0","Msxml2.XMLHTTP.3.0"];
32?????????????for?(var?i=0,l=a.length;i<l;i++){
33?????????????????try{
34??????????????????????return?new?ActiveXObject(a[i]);
35?????????????????}catch(e){};
36?????????????}
37?????????}
38?????},
39?????//回調(diào)函數(shù)
40?????fnCallback?:?function(callback){
41?????
42?????????if(this.xhr.readyState?===?4?&&?this.xhr.status?===?200)?{
43?????????????callback?callback(this.xhr.responseText):void(0);
44?????????}
45?????},
46?????//ajax請求
47?????request?:?function(url,?data,?callback,?type){
48?
49?????????var?that?=?this;
50?????????var?ispost?=?type==='post'?true:false;
51?????????
52?????????!ispost?&&?(url?+=?(url.indexOf('?')+1?'&':'?')?+?json2str(data));
53?????????
54?????????this.xhr?=?this.createXmlHttpRequest();
55?????????
56?????????this.xhr.open(type,url,true);
57?????????ispost?this.xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded"):'';
58?????????this.xhr.onreadystatechange?=?function(){that.fnCallback(callback);};
59?????????this.xhr.send(ispost?json2str(data):null);
60?????}
61?}

?

?

?這個(gè)類，肯定有不足的了，歡迎拍磚吧！每個(gè)人都有自己的習(xí)慣用法，最重要是適合用就行了！

?

轉(zhuǎn)載于:https://www.cnblogs.com/floyd/archive/2010/09/16/1828132.html

《新程序員》：云原生和全面數(shù)字化實(shí)踐50位技術(shù)專家共同創(chuàng)作，文字、視頻、音頻交互閱讀

總結(jié)

以上是生活随笔為你收集整理的前端开发的开始---基于OO的Ajax类的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。