前言
眾所周知，jquery在我們?nèi)粘ｉ_發(fā)中的使用頻率非常高，與js相比，我們省去了冗長的獲取元素的代碼，不用考慮一些麻煩的兼容問題，更加方便的動畫實現(xiàn)，以及更加方便的方法調(diào)用讓我們覺得jquery真是越用越舒服。但是jquery說到底還是對js的封裝，我們不光要用的舒服還要深入理解其中的原理，這樣才能更好的使用它。
首先我們封裝的函數(shù)為了能實現(xiàn)可傳入無限多個參數(shù)，在使用我們即將封裝的函數(shù)時，需要使用對象進行傳參，形式如下：
//data作為參數(shù)傳入我們下面封裝的函數(shù)var data = { //數(shù)據(jù) user:"yonghu1", pass:'12345', age:18, //回調(diào)函數(shù) success:function (data){ alert(data); } }函數(shù)封裝：
1、封裝一個輔助函數(shù)，把傳進來的對象拼接成url的字符串
function toData(obj){ if (obj == null){ return obj; } var arr = []; for (var i in obj){ var str = i+"="+obj[i]; arr.push(str); } return arr.join("&");}2、封裝Ajax
function ajax(obj){ //指定提交方式的默認值 obj.type = obj.type || "get"; //設(shè)置是否異步，默認為true(異步) obj.async = obj.async || true; //設(shè)置數(shù)據(jù)的默認值 obj.data = obj.data || null; if (window.XMLHttpRequest){ //非ie var ajax = new XMLHttpRequest(); }else{ //ie var ajax = new ActiveXObject("Microsoft.XMLHTTP"); } //區(qū)分get和post if (obj.type == "post"){ ajax.open(obj.type,obj.url,obj.async); ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); var data = toData(obj.data); ajax.send(data); }else{ //get test.php?xx=xx&aa=xx var url = obj.url+"?"+toData(obj.data); ajax.open(obj.type,url,obj.async); ajax.send(); } ajax.onreadystatechange = function (){ if (ajax.readyState == 4){ if (ajax.status>=200&&ajax.status<300 || ajax.status==304){ if (obj.success){ obj.success(ajax.responseText); } }else{ if (obj.error){ obj.error(ajax.status); } } } } }以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持武林網(wǎng)。
新聞熱點
疑難解答
