Question

说明

我试图找出一种方法来检查是否存在具有特定类的元素。

然后我遇到了这段代码：

if ($(".mydivclass")[0])
{
   // Do something if class exists
} 
else 
{
   // Do something if class does not exist
}

其中声明如果first ([0])索引处存在真值，则假定类存在。

现在我再次找到另一种解决方案：
```
if ($(".mydivclass").size())
{
     // code here
}
```
size()方法只返回jQuery选择器选择的元素数 - 在这种情况下是类mydivclass的元素数。如果它返回0，则表达式为false，因此没有，如果返回任何其他数字，则div必须存在。

所以我的问题在于，这两个中哪一个更快？

Answer 1

$('.mydivclass')[0]是最快的方法。

<强>来源：

性能测试：

http://jsperf.com/check-if-div-exists

相关问题：

Check if div with certain class name exists

Answer 2

所以我也很好奇，并且我对以下5种方法进行了一些测试：

$（＆＃39; .className＆＃39;）[0]
$（＆＃39; .className＆＃39）。大小（）
$（＆＃39; .className＆＃39;）长度
document.querySelector（＆＃39; .className＆＃39）
document.getElementsByClassName（＆＃39;的className＆＃39;）[0]

我的剧本：

var testCount = 100000;
var cn = 'container';
var cns = '.'+cn;
console.time('[0]');
for(var i=testCount;i>0;i--){
    if($(cns)[0]){};
}
console.timeEnd('[0]');

console.time('.size');
for(var i=testCount;i>0;i--){
    if($(cns).size()){};
}
console.timeEnd('.size');

console.time('.length');
for(var i=testCount;i>0;i--){
    if($(cns).length){};
}
console.timeEnd('.length');

console.time('querySelector');
for(var i=testCount;i>0;i--){
    if(document.querySelector(cns)){};
}
console.timeEnd('querySelector');

console.time('classname');
for(var i=testCount;i>0;i--){
    if(document.getElementsByClassName(cn)[0]){};
}
console.timeEnd('classname');

我在此页面中进行测试，只需粘贴代码并在chrome控制台中运行它。事实证明，前3种方法具有相似的性能，仅相差<100 ms。

querySelector方法在类存在时很快但在类不存在时速度最慢...不知道为什么会这样。

getElementsByClassName方法最快，只占前三个方法的1/10。

这是其中一个结果：

[0]: 2168.198ms 
.size: 1951.075ms 
.length: 1936.117ms 
querySelector: 672.186ms 
classname: 242.048ms

并回答你的问题，我认为两者并没有真正有一个更快的问题，为此目的都很慢......

更快确定具有类的元素是否存在的方法？

说明

2 个答案: