发现自己经常在涉及到jQuery选择器的时候出现犹豫,于是在这边记一下。
首先,jQuery选择器主要分为两类:伪类选择器和css选择器
这边着重需要考虑到性能问题的是伪类选择器
思路:尽量不使用伪类选择器(慢)
伪类选择器又大概分为这么几种:
1、选择表单元素
如 :checkbox :select等等。如果不考虑性能,考虑方便。我们一般写成
$("element:checkbox");
考虑性能后,更好的写法是
$("element[type=checkbox]");
如果一定要使用前面一种写法,那么记得要加上前面的标签名。
2、选择部分元素
如 :even :lt :gt等等
不考虑性能:
$("element:even");
考虑性能:
$("element").filter(":even");
其中,:lt和:gt是选择一定范围内的元素。在性能上考虑,可以用别的方式实现。
:lt(index)可以用.slice(0,index)替代
:gt(index)可以用.slice(index)替代
3、所有有对应方法的伪类选择器
如 :has :not等等
:has应该用.has()替代
.not应该用.not()替代
其余未说明的可以不考虑性能问题。
css选择器:jQuery默认根据浏览器支持来选择性能最佳的查找方法
总结:
善用.filter()可以提升选择器的性能
这些工作都不是必须的,但需要日常积累养成这样一种意识。
个人见解,有意见欢迎指出。