實例代碼:
// 封裝的ajax網絡請求函數 // obj 是一個對象 function AJAX(obj){ //跨域請求 if (obj.dataType == "jsonp") { //在這裡 callback 必須是全局變量 保證函數消失的時候 這個變量不可以被銷毀 //處理一下函數名(防止多個網絡請求 函數名字相同 出現紊亂的情況) var hehe = "callBack" + "_" + new Date().getTime() + "_" + String(Math.random()).replace(".",""); window[hehe] = obj.success; //創建 script標簽 var sc = document.createElement("script"); sc.src = obj.url + "?" + "cb=" + hehe; console.log(sc.src); document.body.appendChild(sc); document.body.removeChild(sc); return; } //1、創建 ajax 對象 var ajaxObj = null; if (window.XMLHttpRequest) { ajaxObj = new XMLHttpRequest(); }else{ ajaxObj = new ActiveXObject("Microsoft.XMLHTTP"); } //設置請求的類型 obj.type = obj.type.toUpperCase() || "GET"; //如果是get請求 並且需要傳遞參數 則需要給 url 後面拼接參數 if (obj.type == "GET") { var arr = [];//定義數組 用於把對象存儲到數據裡面 for (var key in obj.data) { arr.push(key +"="+ obj.data[key]); } //用&分隔數組 讓其轉化為類似:name=lxl&age=18 的形式 var str = arr.join("&"); obj.url = obj.url +"?"+ str; //撥號 ajaxObj.open(obj.type,obj.url,true); //發送"name=123&age=18" ajaxObj.send(); }else{ var arr = [];//定義數組 用於把對象存儲到數據裡面 for (var key in obj.data) { arr.push(key +"="+ obj.data[key]); //console.log(arr); } //用&分隔數組 讓其轉化為類似:name=lxl&age=18 的形式 var str = arr.join("&"); //console.log(str); ajaxObj.open(obj.type,obj.url,true); ajaxObj.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); ajaxObj.send(str); } //監聽 ajaxObj.onreadystatechange = function(){ if (ajaxObj.readyState == 4) { if (ajaxObj.status >= 200 && ajaxObj.status < 300 || ajaxObj.status == 304) { //請求成功 obj.success(ajaxObj.responseText); }else{ //請求失敗 obj.error(ajaxObj.status); } } } }
以上這篇關於ajax網絡請求的封裝實例就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持。