jQuery性能优化指南 [2]-优快云博客

本文链接：https://blog.youkuaiyun.com/guosong20120327/article/details/83519150

本文介绍了在使用jQuery时如何优化选择器的性能，包括避免使用class作为主要选择器，利用tag name来限定class选择，以及正确的ID选择方式等实用技巧。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

作者：Rlog　时间： 2009-05-26　文档类型：翻译　来自：Time Machine
[url]http://www.blueidea.com/tech/web/2009/6737.asp[/url]
为了方便大家学习和我以后的学习方便真理了一下 (oo)(oo)(oo)(oo)


2. 在class前使用tag

第二快的选择器是tag选择器($(’head’)). 同理,因为它来自原生的getElementsByTagName() 方法.

<div id=“content”>
<form method=“post” action=“/”>
<h2>Traffic Light</h2>
<ul id=“traffic_light”>
<li><input type=“radio” class=“on” name=“light” value=“red” /> Red</li>
<li><input type=“radio” class=“off” name=“light” value=“yellow” /> Yellow</li>
<li><input type=“radio” class=“off” name=“light” value=“green” /> Green</li>
</ul>
<input class=“button” id=“traffic_button” type=“submit” value=“Go” />
</form>
</div>;
总是用一个tag name来限制(修饰)class (并且不要忘记就近的ID):

var active_light = $(‘#traffic_light input.on’);
注意: 在jquery中Class是最慢的选择器. IE浏览器下它会遍历所有DOM节点不管它用在那里.

不要用用tag name来修饰ID. 下面的例子将会遍历所有的div元素来查找id为’content’的哪一个节点:

var content = $(‘div#content’);
用ID修饰ID也是画蛇添足:

var traffic_light = $(‘#content #traffic_light’);