在javascript編程中,開發者通常需要編寫很多小程序來實現一些特定的功能。例如瀏覽器檢測,字符串處理、數組的編輯等。jQuery對這些常用的程序進行了總結,提供了很多實用的函數。
1.檢測瀏覽器。
jQuery通過$.browser對象獲取瀏覽器信息。
屬性 說明
msie 如果是ie為true,否則為false
mozilla 如果是mozilla相關的瀏覽器為true,否則為false
safari 如果是Safari瀏覽器為true,否則為false
poera 如果是opera瀏覽器為true,否則為false
version 瀏覽器的版本號
在使用時,開發者可以直接調用這些屬性來獲取瀏覽器屬性。如下:
});
</script>
2.盒子模型
在jQuery中提供了$.boxModel對象來檢測目前所遵循的盒子模型。它是一個布爾值,當為true時,表示遵循w3c標準盒子模型,如果false則為ie的盒子模型
var sBox = $.boxModel ? "標準W3C" : "IE";
document.write("您的頁面目前支持:" + sBox + "盒子模型");
3.處理javascript對象。
在javascript編程中,可以說一切變量都是對象,例如字符串,日期和數值等。
jQuery提供了一些編輯的方法來處理相關的對象,例如$.trim()函數(首尾去空格) 函數就是其中之一
i.使用$each()方法遍歷
前文介紹到each()方法,用于選擇器的中的元素遍歷,同樣對于javascript的數組和對象,可以使用$.each()方法進行遍歷。
$.each(object,fn);
其中,object為需要遍歷的對象,fn為object中每個元素都執行的函數,其中函數fn可以接受兩個參數,第一個參數為數組元素的序號或者是對象的屬性。第二個參數為元素或者屬性的值。
例子:用$.each()函數遍歷數組和對象
從上面的例子可以看到,$.each()對遍歷數組和對象都十分方便,例如對未知的屬性$.browser,使用$.each進行遍歷
$.each($.browser, function(iNum, value) {
//征對數組
document.write("屬性" + iNum + "值" + value + "<br>");
});
得值:
屬性chrome值true
屬性version值39.0.2171.99
屬性webkit值true
ii.過濾數據
對于數組中的數據,很多時候開發者需要對其進行篩選,如果使用純javascript,往往需for循環進行逐一檢查。jQuery提供了$.grep()方法。能夠便捷的過濾數組的數據。
其語法如下:
$.grep(Array,fn,[invert])
其中,array是需要過濾的數組對象名稱,fn為過濾函數,對數組中的每個對象,如果返回true則保留,否則去除??蛇x的invert為布爾值,如果設置為true.則函數fn取反,滿足條件的被去除。
首先定義了數組aArray,然后用$.grep()方法將值大于等于4挑選出來得到新的數組
例子2,過濾數組的高級方法。
document.write(aResult.join());
</script>
iii轉化數組
很多時候開發者希望某個數組中的元素能夠統一的轉化,例如將所有的元素都乘以2.雖然在javascript中例如for循環可以實現,但是jQuery提供了更為便利的$.map()方法。這個方法如下
$.map(array,fn)
其中,array為要轉化的數組,fn為轉化函數,對數組中的每一項都執行,該函數同樣可以接受兩個函數,1個參數為元素的值。2個參數為元素的序號,是可選參數。
cArray = $.map(aArray, function(value) {
return value + value;
});
$("p:eq(2)").text(cArray.join());
});
</script>
<p></p>
<p></p>
<p></p>
執行結果
a,b,c,d,e,f,g,h,i
A0,B1,C2,D3,E4,F5,G6,H7,I8
A0A0,B1B1,C2C2,D3D3,E4E4,F5F5,G6G6,H7H7,I8I8
使用$.map()函數進行轉移后,數組長度不一定與原來的數組相同??梢酝ㄟ^設置null來刪除數組的元素。
除了刪除元素外,$.map轉化數組時同樣可以增加數組元素。
執行結果
one,two,three,four,five
cArray長度:19值:o,n,e,t,w,o,t,h,r,e,e,f,o,u,r,f,i,v,e
以上代碼在$.map轉化過程中,split("")方法將元素拆分為一個個字母
iiii搜索數組元素
對于字符串,可以通過indexOf()來搜索特定字符所處的位置,對于數組元素,javascript沒有提供類似的方法。在jQ中,$.inArray()函數可以很好的數組元素的搜索功能。語法如下:
$.inArray(value,array)
其中,value為希望查找的對象,array為數組本身,如果找到了則返回第一個匹配元素在數組的位置。如果沒有則返回-1.
4.獲取外部代碼
在一些較大工程中,開發者將不同的js放在不同的js文件中,有時根據補貼的需求加載不同的代碼。jQuery提供了$.getScript()實現外邊的代碼加載。使用方法如:
$.getScript(url,[callback])
其中,url為外部資源的地址,可以是相對的,也可以是絕對的地址。callback為加載成功后的回調函數,可選。
其中1.js代碼為
新聞熱點
疑難解答