1、总是从ID选择器开始继承。在jQuery中最快的选择器是ID选择器,因为它直接来自于Javascript的getElementById()方法。第二快的是tag(标签)选择器,它来自原生的getElementsByTagName()。
- 选择单个元素,我们可以使用tagName来限制class名,当然也可以结合就近的ID。
- 选择多个元素,必然会涉及到DOM遍历和循环,为了提高性能,建议从最近的ID开始继承。
2、养成将jQuery对象缓存进变量的习惯。
记住,永远不要让相同的选择器在你的代码里多次出现。同一个对象的多次操作,可以使用链式操作。
3、当要进行DOM插入时,将所有元素封装成一个元素。
这里的基本思想是在内存中建立你确实想要的东西,然后更新DOM。直接的DOM操作很慢,尽可能少的去更改HTML结构。
4、使用直接函数,而不是使用与之等同的函数。
为了获得更好的性能,应该用直接函数。如.ajax(),而不是.get(),.getJSON(),.post(),因为后面几个将会调用$.ajax()。
5、采用jQuery内部函数data()来存储状态。
存储:$("#home").data("name","value");
调用:$("#home").data("name");
6、使用jQuery utility函数。
如:isFunction(),isArray(),$.each()。
7、使用Event Delegation。
当在一个容器中有许多节点,你想对所有的节点都绑定一个事件,delegation很适合这样的场景。使用delegation,我们仅需要在父级元素绑定事件,然后查看哪个子节点(目标节点)触发了事件。
$("#menu").delegation("a","click",function(){
$(this).toggleClass("active");
})
8、如果给15个以上的元素添加样式时,直接给DOM元素添加style标签。
要给少数的元素添加样式,最好的方法是使用jQuery的css()函数。然而给15个以上的较多的元素添加样式时,直接给DOM元素添加style标签更有效些。这个方法可以避免在代码中使用硬编码(hard code)。
$('<style type="text/css">.home{background:#000;}</style>').appendTo('head');
9、