JQuery 的優先級

1.使用最新的jQuery版本

2.用對選擇器.
   2.1 jquery最快的選擇器是ID選擇器：來源於js的getElementById()方法

   注釋：需要選擇多個元素，必然涉及到Dom遍歷和循環，為了提交性能，建議從最近的ID開始繼承
   例如：<div id="div"><ul id="ul"><li class="on">1</li><li class="off">2</li></ul></div>  var ul=$("#ul")

    2.2 第二快的選擇器是tag(標簽)選擇器，它是來自原生getElementsByTagName()方法
    如上例子：var light=$("#ul input.on")
    
    2.3 較慢的選擇器 class 選擇器
    $('.className')的性能，取決於不同的瀏覽器 moz webkit safari o 瀏覽器都有原生方法：getElementByClassName()所以速度並不慢
    但是IE5-IE8都沒有會相當慢

    2.4 最慢的選擇器：偽類選擇器和屬性選擇器:原因：因為沒有針對他們的原生方法，但是一些新的瀏覽器版本有：queryselector()和        

queryselectorAll()放來提高性能
     偽類選擇器：$(':hidden')
     屬性選擇器：$('attribute=value')  attribute:屬性名:id、name、class... value 值   例如：id='ss'
3.理解子元素和父元素的關系
   var list=$("#list");
  【1.$('.child', $parent)2.$parent.find('.child')3.$parent.children('.child')4.$('#parent > .child')5.$('#parent .child')6.       

  $('.child', $('#parent'))】
   語句：  $('.child', $parent)
   解釋：這條語句的意思是，給定一個DOM對象，然后從中選擇一個子元素。jQuery會自動把這條語句轉成$.parent.find('child')，這會導致一定 

         的性能損失。它比最快的形式慢了5%-10%。
   轉化：$('.child',$('.ss').parent)=$('.child', $parent)[.child與.ss是同級]
     $('.child', $parent)=$('.child', list)
   
   語句：$parent.find('.child')
   解釋：這條是最快的語句。.find()方法會調用瀏覽器的原生方法（getElementById，getElementByName，getElementByTagName等等），所以速  

       度較快。
   轉化： $parent.find('.child')=  $(list).find('.test');

   語句：$parent.children('.child')
   解釋：這條語句在jQuery內部，會使用$.sibling()和javascript的nextSibling()方法，一個個遍歷節點。它比最快的形式大約慢50%。
   轉化： $parent.children('.child') =$test = $(list).children('.test');

   語句：$('#parent > .child')
   解釋：jQuery內部使用Sizzle引擎，處理各種選擇器。Sizzle引擎的選擇順序是從右到左，所以這條語句是先選.child，然后再一個個過濾出父  

       元素#parent，這導致它比最快的形式大約慢70%。
   轉化：$('#parent > .child')=var $test = $('#list > .test');

   語句：$('#parent .child')
   解釋：這條語句與上一條是同樣的情況。但是，（上一條只選擇直接的子元素，這一條可以於選擇多級子元素），所以它的速度更慢，大概比最

快的         形式慢了77%。
   轉化：var $test = $('#list .test'); 

   語句：$('.child', $('#parent'))
   解釋；jQuery內部會將這條語句轉成$('#parent').find('.child')，比最快的形式慢了23%。
   轉化：var $test = $('#list').find('.test');
總結：除了優先級后，很重要的一個原因是是否 緩存了。
      同時，多級和chidren的使用也會有導致很大的影響

4.不要過度的使用jQuery
  最簡單的語句 js至少比$(快10多倍)

5.做好緩存（很重要）
   var cached=jQuery('#top')
   根據測試，緩存比不緩存快了2-3倍
      5.1.將jQuery對象緩存起來：永遠不要讓相同的選擇器在你的代碼里出現多次
      錯誤的寫法：
      例如：$("#traffic_light input.on").bind("click", function(){ ... });
      $("#traffic_light input.on").css("border", "1px dashed yellow");
      正確的寫法：
      例如：var $active_light = $("#traffic_light input.on");
      $active_light.bind("click", function(){ ... });
      $active_light.css("border", "1px dashed yellow"); 
      更高效的寫法，鏈式寫法
      $active_light.bind("click", function(){ ... }).css("border", "1px dashed yellow") 
      如果打算在其他函數中使用Jquery對象，則必須把它們緩存到全局環境中
      例如：window.$my={window.$my = {  head : $("head"),  traffic_light : $("#traffic_light"),  traffic_button :                  

  $("#traffic_button")  };  function do_something(){  }
            當在函數內部時，可以繼續將查詢存入到全局對象中去$my.cool_results = $("#some_ul li");  
            將全局函數作為一個普通的jq對象去使用
            $my.other_results.css("border-color", "red");


6.使用鏈式寫法
  $('div').find('h3').eq(2).html('Hello'); 
  采用鏈式寫法時，jQuery自動緩存每一步的結果，因此比非鏈式寫法要快。根據測試，鏈式寫法比（不使用緩存的）非鏈式寫法，大約快了25%。

7.事件的委托處理（冒泡）
  初級：每個每個格子綁定一個點擊事件
  $("td").on("click", function(){
      alert（“司法所地方”）
   });
  初級優化：原理：這個事件只需要在父元素綁定1次即可，而不需要在子元素上綁定100次，從而大大提高性能。這就叫事件的”委托處理”，也就 

                 是子元素”委托”父元素處理這個事件
  $(“table”).delegate(“td”, “click”, function(){
       alert("斯蒂芬森飛灑")
   });
  更好的寫法，則是把事件綁定在document對象上面。
  $(document).on("click", "td", function(){ $(this).toggleClass("click"); });document=指定的id或class

8.少改動DOM結構
  （1）改動DOM結構開銷很大，因此不要頻繁使用.append()、.insertBefore()和.insetAfter()這樣的方法。
    如果要插入多個元素，就先把它們合並，然后再一次性插入。根據測試，合並插入比不合並插入，快了將近10倍。
  （2）如果你要對一個DOM元素進行大量處理，應該先用.detach()方法，把這個元素從DOM中取出來，處理完畢以后，再重新插回文檔。根據測試， 

   使用.detach()方法比不使用時，快了60%。
  （3）如果你要在DOM元素上儲存數據，不要寫成下面這樣：
    var elem = $(‘#elem');
    elem.data(key,value);

9.正確處理循環
  循環總是一種比較耗時的操作，如果可以使用復雜的選擇器直接選中元素，就不要使用循環，去一個個辨認元素。
  javascript原生循環方法for和while，要比jQuery的.each()方法快，應該優先使用原生方法。


網站：http://www.jb51.net/article/25530.htm
      http://caibaojian.com/jquery-performance-optimization.html
      http://www.2cto.com/kf/201308/238441.html