|
1.總是從ID選擇器開始繼承
在jQuery中最快的選擇器是ID選擇器,因?yàn)樗苯觼?lái)自于JavaScript的getElementById()方法。
例如有一段HTML代碼:
Code
<div id="content">
<form method="post" action="#">
<h2>交通信號(hào)燈</h2>
<ul id="traffic_light">
<li><input type="radio" class="on" name="light" value="red" /> 紅色</li>
<li><input type="radio" class="off" name="light" value="yellow" /> 黃色</li>
<li><input type="radio" class="off" name="light" value="green" /> 綠色</li>
</ul>
<input class="button" id="traffic_button" type="submit" value="Go" />
</form>
</div>
3.將jQuery對(duì)象緩存起來(lái)
把jQuery對(duì)象緩存起來(lái) 就是要告訴我們 要養(yǎng)成將jQuery對(duì)象緩存進(jìn)變量的習(xí)慣。下面是一個(gè)jQuery新手寫的一段代碼:
$("#traffic_light input.on").bind("click", function(){ ... });
$("#traffic_light input.on").css("border", "1px dashed yellow");
$("#traffic_light input.on").css("background-color", "orange");
$("#traffic_light input.on").fadeIn("slow");
但切記不要這么做。我們應(yīng)該先將對(duì)象緩存進(jìn)一個(gè)變量然后再操作,如下所示:
var $active_light = $("#traffic_light input.on");
$active_light.bind("click", function(){ ... }); $active_light.css("border", "1px dashed yellow");
$active_light.css("background-color", "orange");
$active_light.fadeIn("slow");
記住,永遠(yuǎn)不要讓相同的選擇器在你的代碼里出現(xiàn)多次。
注:(1)為了區(qū)分普通的JavaScript對(duì)象和jQuery對(duì)象,可以在變量首字母前加上 $ 符號(hào)。
(2)上面代碼可以使用jQuery的鏈?zhǔn)讲僮骷右愿纳啤H缦滤荆?/p> var $active_light = $("#traffic_light input.on");
NET技術(shù):jQuery性能優(yōu)化指南(1),轉(zhuǎn)載需保留來(lái)源!
鄭重聲明:本文版權(quán)歸原作者所有,轉(zhuǎn)載文章僅為傳播更多信息之目的,如作者信息標(biāo)記有誤,請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除,多謝。