日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時間：8:30-17:00
你可能遇到了下面的問題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
到處都是jQuery選擇器的年代

如今jQuery在網(wǎng)站上普及的程度越來越高，所以，對于jQuery的使用，即使再小的一點認(rèn)識、一點優(yōu)勢、一點不足，也顯得越來越值得研究和探討。最近，我就對jQuery的選擇器使用做了一些個小小的實驗，用來說明jQuery的不同選擇器在不同的情況下，哪個效率更高，更值得使用。

為湘橋等地區(qū)用戶提供了全套網(wǎng)頁設(shè)計制作服務(wù)，及湘橋網(wǎng)站建設(shè)行業(yè)解決方案。主營業(yè)務(wù)為網(wǎng)站建設(shè)、做網(wǎng)站、湘橋網(wǎng)站設(shè)計，以傳統(tǒng)方式定制建設(shè)網(wǎng)站，并提供域名空間備案等一條龍服務(wù)，秉承以專業(yè)、用心的態(tài)度為用戶提供真誠的服務(wù)。我們深信只要達(dá)到每一位用戶的要求，就會得到認(rèn)可，從而選擇與我們長期合作。這樣，我們也可以走得更遠(yuǎn)！

先在每個測試頁面的head中引入google提供的jquery文件和用于測試的小插件firejspt。

 
 
 
 
    
  
  
  
  
  1.   
    2. 
  
  
  
  
  2.   
    3. 
  
  
  
  
  3.   
    4. 
  
  
  
  
  4.  
    5.

1. 最常用的id選擇器和class選擇器，將以下代碼復(fù)制200次，置于body標(biāo)簽內(nèi)。

 
 
 
 
    
  
  
  
  
  1. 比較id選擇器和class選擇器
 
  • 比較id選擇器和class選擇器
    •  

    用于本次測試的JS代碼如下：

     
 
 
 
      
  
  
  
  
    1. function ilianTest01(){  
      2. 
  
  
  
  
    2.         $('#ilian').click(function() { alert('Hello World'); });  
      3. 
  
  
  
  
    3. }  
      4. 
  
  
  
  
    4.  
      5. 
  
  
  
  
    5. function ilianTest02(){  
      6. 
  
  
  
  
    6.         $('.ilian').click(function() { alert('Hello World'); });  
      7. 
  
  
  
  
    7. }  
      8. 
  
  
  
  
    8.  
      9. 
  
  
  
  
    9. /*調(diào)用2個函數(shù)進(jìn)行測試*/ 
      10. 
  
  
  
  
    10. $(function(){  
      11. 
  
  
  
  
    11. jspt.test(function(){ ilianTest01(); });  
      12. 
  
  
  
  
    12. jspt.test(function(){ ilianTest02(); });  
      13. 
  
  
  
  
    13. }); 
      14.

    測試結(jié)果如下：

    由圖可以id選擇器相比于class選擇器的效率優(yōu)勢是非常地。。。。。

    附本次測試地址：http://www.threesnow.com/code/090/ilian_01.html

    2. 在選擇標(biāo)簽時，層級選擇器用得也非常頻繁，這次對比測試直接子標(biāo)簽符號“>”和children。

    將以下代碼放入body標(biāo)簽內(nèi)，并將其中的li標(biāo)簽復(fù)制500次。

     
 
 
 
      
  
  
  
  
    1.  
      2. 
  
  
  
  
    2.     
    3. 比較直接子標(biāo)簽符號“>”和children
      4.  
  
  
  
  
    4.     
    5. 比較直接子標(biāo)簽符號“>”和children
      6.  
  
  
  
  
    6.     
    7. 比較直接子標(biāo)簽符號“>”和children
      8.  
  
  
  
  
    8.      
      9. 
  
  
  
  
    9.  
      10.

    用于本次測試的JS代碼如下：

     
 
 
 
      
  
  
  
  
    1. function ilianTest01(){  
      2. 
  
  
  
  
    2. $('#ilian > li').click(function() { alert('Hello World'); });  
      3. 
  
  
  
  
    3. }  
      4. 
  
  
  
  
    4.  
      5. 
  
  
  
  
    5. function ilianTest02(){  
      6. 
  
  
  
  
    6. $('#ilian').children('li').click(function() { alert('Hello World'); });  
      7. 
  
  
  
  
    7. }  
      8. 
  
  
  
  
    8.  
      9. 
  
  
  
  
    9. /*調(diào)用2個函數(shù)進(jìn)行測試*/ 
      10. 
  
  
  
  
    10. $(function(){  
      11. 
  
  
  
  
    11. jspt.test(function(){ ilianTest01(); });  
      12. 
  
  
  
  
    12. jspt.test(function(){ ilianTest02(); });  
      13. 
  
  
  
  
    13. }); 
      14.

    測試結(jié)果：

    由此可見children選擇器要優(yōu)于直接子標(biāo)簽符號選擇器。

    附本次測試地址：http://www.threesnow.com/code/090/ilian_02.html

    限于文章長度，本文只展示了最基本的測試，且以上測試，均是在簡單環(huán)境中測試的，測試效果并不代表絕對的結(jié)論。

    原文鏈接：http://www.cnblogs.com/ilian/archive/2012/06/11/jquery-selector-test.html

    【編輯推薦】

    1. jQuery:讓文盲秀網(wǎng)頁
    2. jQuery和PHP打造功能開關(guān)效果
    3. jQuery圖片延遲加載技術(shù)的應(yīng)用
    4. 10個基于jQuery的Web交互插件
    5. JQuery插件的開發(fā)真的有那么難嗎

    新聞標(biāo)題：到處都是jQuery選擇器的年代
    網(wǎng)站網(wǎng)址：http://www.5511xx.com/article/dhdgcpo.html