/** * ITCAST WEB * Created by lsy on 2016/5/24. */ /* * 1. 請求的類型 type get post * 2. 請求地址 url * 3. 是異步的還是同步的 async false true * 4. 請求內容的格式 contentType * 5. 傳輸的數據 data json對象 * * 6.響應成功處理函數 success function * 7.響應失敗的處理函數 error function * * 這些都是動態參數 參數對象 options * */ /*封裝一個函數*/ window.$ = {}; /*申明一個ajax的方法*/ $.ajax = function(options){ if(!options || typeof options != 'object'){ return false; } /*請求的類型*/ var type = options.type || 'get';/*默認get*/ /*請求地址 */ var url = options.url || location.pathname;/*當前的地址*/ /*是異步的還是同步的 */ var async = (options.async === false)?false:true;/*默認異步*/ /*請求內容的格式 */ var contentType = options.contentType || "text/html"; /*傳輸的數據 */ var data = options.data || {};/*{name:'',age:''}*/ /*在提交的時候需要轉成 name=xjj 這種格式*/ var dataStr = ''/*數據字符串*/ for(var key in data){ dataStr += key+'='+data[key]+'&'; } dataStr = dataStr && dataStr.slice(0,-1); /*ajax 編程*/ var xhr = new XMLHttpRequest(); /*請求行*/ /*(type=='get'?url+'?'+dataStr:url)判斷當前的請求類型*/ xhr.open(type,(type=='get'?url+'?'+dataStr:url),async); /*請求頭*/ if(type == 'post'){ xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); } /*請求主體*/ /*需要判斷請求類型*/ xhr.send(type=='get'?null:dataStr); /*監聽響應狀態的改變 響應狀態*/ xhr.onreadystatechange = function(){ /*請求響應完成並且成功*/ if(xhr.readyState == 4 && xhr.status == 200){ /*success*/ var data = ''; var contentType = xhr.getResponseHeader('Content-Type'); /*如果我們服務器返回的是xml*/ if(contentType.indexOf('xml') > -1){ data = xhr.responseXML; } /*如果我們的服務器返回的是json字符串*/ else if(contentType.indexOf('json') > -1){ /*轉化json對象*/ data = JSON.parse(xhr.responseText); } /*否則的話他就是字符串*/ else{ data = xhr.responseText; } /*回調 成功處理函數*/ options.success && options.success(data); } /*計時請求xhr.status不成功 他也需要的響應完成才認作是一個錯誤的請求*/ else if(xhr.readyState == 4){ /*error*/ options.error && options.error('you request fail !'); } } } $.post = function(options){ options.type = 'post'; $.ajax(options); } $.get = function(options){ options.type = 'get'; $.ajax(options); }