有声,如何发布网络小说,古风小说君子以泽

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營(yíng)銷解決方案

到處都是jQuery選擇器的年代

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

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

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

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

 
 
 
 
  
  
  
  比較id選擇器和class選擇器

比較id選擇器和class選擇器

用于本次測(cè)試的JS代碼如下：

 
 
 
 
  
  
  
  function ilianTest01(){  
  
  
  
          $('#ilian').click(function() { alert('Hello World'); });  
  
  
  
  }  
  
  
  
   
  
  
  
  function ilianTest02(){  
  
  
  
          $('.ilian').click(function() { alert('Hello World'); });  
  
  
  
  }  
  
  
  
   
  
  
  
  /*調(diào)用2個(gè)函數(shù)進(jìn)行測(cè)試*/ 
  
  
  
  $(function(){  
  
  
  
  jspt.test(function(){ ilianTest01(); });  
  
  
  
  jspt.test(function(){ ilianTest02(); });  
  
  
  
  });

測(cè)試結(jié)果如下：

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

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

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

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

 
 
 
 
  
  
  
   
  
  
  
      
比較直接子標(biāo)簽符號(hào)“>”和children 
  
  
  
      
比較直接子標(biāo)簽符號(hào)“>”和children 
  
  
  
      
比較直接子標(biāo)簽符號(hào)“>”和children

用于本次測(cè)試的JS代碼如下：

 
 
 
 
  
  
  
  function ilianTest01(){  
  
  
  
  $('#ilian > li').click(function() { alert('Hello World'); });  
  
  
  
  }  
  
  
  
   
  
  
  
  function ilianTest02(){  
  
  
  
  $('#ilian').children('li').click(function() { alert('Hello World'); });  
  
  
  
  }  
  
  
  
   
  
  
  
  /*調(diào)用2個(gè)函數(shù)進(jìn)行測(cè)試*/ 
  
  
  
  $(function(){  
  
  
  
  jspt.test(function(){ ilianTest01(); });  
  
  
  
  jspt.test(function(){ ilianTest02(); });  
  
  
  
  });

測(cè)試結(jié)果：

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

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

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

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

【編輯推薦】

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

網(wǎng)站欄目：到處都是jQuery選擇器的年代
本文URL：http://m.fisionsoft.com.cn/article/dhdgcpo.html

新聞中心

其他資訊