jQuery效能優化指南（3）

8，盡量使用id代替class。

前面效能優化已經說過，id選擇器的速度是最快的。所以在html**中，能使用id的盡量使用id來代替class。

看下面的乙個例子：

// 建立乙個list

var $mylist = $('#mylist');

var mylistitems = '';

$mylist.html(mylistitems);

// 選擇每乙個 li

for (i = 0; i < 1000; i++)

在**最後，選擇每個li的過程中，總共用了5066毫秒，超過5秒了。

接著我們做乙個對比，用id代替class：

// 建立乙個list

var $mylist = $('#mylist');

var mylistitems = '';

$mylist.html(mylistitems);

// 選擇每乙個 li

for (i = 0; i < 1000; i++)

在上段**中，選擇每個li總共只用了61毫秒，相比class的方式，將近快了100倍。

9，給選擇器乙個上下文

jquery選擇器中有乙個這樣的選擇器，它能指定上下文。

jquery( expression, context );

通過它，能縮小選擇器在dom中搜尋的範圍，達到節省時間，提高效率。

普通方式：

$('.mydiv')

改進方式：

$('.mydiv' , $("#listitem") )

10，慎用 .live()方法（應該說盡量不要使用）

這是jquery1.3.1版本之後增加的方法，這個方法的功能就是為 新增的dom元素 動態繫結事件。

但對於效率來說，這個方法比較占用資源。所以請盡量不要使用它。

例如有這麼一段**:

this is first p

add

你可以改成.live("click")方式解決此問題，**如下：

$(function());

$(function());

$("button").click(function());

})

特別是在頻繁的dom操作中，這點非常明顯。

11，子選擇器和後代選擇器

後代選擇器經常用到，比如：$("#list  p");

後代選擇器獲取的是元素內部所有元素。

而有時候實際只要獲取 子元素，那麼就不應該使用後代選擇器。

應該使用子選擇器，**如下：

$("#list > p");

12，使用data()方法儲存臨時變數

下面是一段非常簡單的**，

$(function()else

});})

改用data()方式後，**如下：

$(function()else

});})

jquery效能優化指南(3)到此結束。

相信你也有你的idea，請共享出來吧。 email : [email protected]

作者的blog：

jQuery效能優化指南

這個話題也是老生常談的了，jquery倒是沒少用，卻很少考慮它的效能！隨著cpu的嗷嗷上揚，覺得應該好好考慮這個問題！最近讀到e文 jquery performance rules 拿來跟大家分享，粗略的翻譯了一下！1 always descend from an id 總是從id選擇器開始繼承 2...

jQuery效能優化指南 2

url 為了方便大家學習和我以後的學習方便 真理了一下 oo oo oo oo 2.在class前使用tag 第二快的選擇器是tag選擇器 head 同理,因為它來自原生的getelementsbytagname 方法.總是用乙個tag name來限制 修飾 class 並且不要忘記就近的id va...

C 效能優化指南

1 用好的編譯器並用好編譯器 支援c 11的編譯器，intelc 速度最快 gnu的c 編譯器gcc g 非常符合標準 visual c 效能折中 clang 最年輕mac os x 2 使用更好的演算法。3 使用更好的資料結構 不同的資料結構在使用記憶體管理器的方式也有所不同 4 使用更好的庫 熟...