Javascript .length与[0]之间的区别是什么，用于检查是否存在ID为的元素

我看到了两种检查页面上是否存在具有特定ID的元素的方法，我想知道为什么第二种方法有效

我看到的一种方式是，我认为我理解以下内容：

if ( $('#elementID').length > 0 ) {
  //Do something
}
else {
  //Do something else
}

另一种我不太理解的方式是：

if ( $('#elementID')[0] ) {
  //Do something
}
else {
  //Do something else
}

[0]是什么意思？我通常看到[…]用于数组，那么这是否返回数组

---

谢谢。

jQuery选择器返回与选择器匹配的值数组

第一个示例检查该数组的长度。第二个示例尝试检查第一个元素是否存在

if ( $('elementID').length > 0 ) {
  //checks the length of the array.  If the selector hit at least 1 element it does something

if ( $('elementID')[0] ) {
  //Tries to check if the first element exists.  
  //This really should work in this case, because jQuery will return jquery objects 
  //but in the general case for checking arrays is dangerous because will be incorrect for falsy values

最后，这两个词都是“如果选择了元素”

---

我最初说第二个是危险的。在jQuery的情况下，事实并非如此，因为jQuery/DOM对象总是真实的。一般来说，通过使用

if（element）

检查元素是否存在是危险的，因为这将为0或“”之类的值返回false。因此，如果你不确定，我会推荐第一个公约，因为它在更广泛的情况下更安全。但是对于这种特殊情况，这两个选项都可以使用。

jQuery包装对象的所有元素/etc都以类似数组的方式存储在内部，因此为什么

.length

可以对其使用，并且您可以看到选择器是否返回任何结果

$('#elementID').length

由于jQuery以类似数组的方式存储它们，因此可以使用典型的

[]

括号表示法单独访问它们。注意，这也将返回一个原始javascriptHtmleElement。它从中删除包装的jQuery

$('#elementID')[0] // returns the 1st element

因为在本例中，两者都返回一个truthy结果，它将继续进入if语句

---

---

jQuery将返回一个空的jQuery包装对象（它将是-truthy-），并继续执行if语句。

为您指出正确的方向：

var test = document.getElementById('test') //returns a HTML DOM Object
var test = $('#test') //returns a jQuery Object
var test = $('#test')[0] //returns a HTML DOM Object

---

它们实际上都与jQuery没有直接关系$（选择器）返回与选择器匹配的jQuery对象数组。因此，您可以使用Array.length属性检查有多少匹配项。同样，您可以通过数组的零基索引访问数组中的任何项。$（选择器）[0]将返回数组中的第一个HtmleElement对象，$（选择器）[1]将返回第二个HtmleElement对象。等等

---

虽然if（$（选择器）[0]）在某些情况下可以工作，但它不返回布尔值，因此该条件有缺陷，不应使用。相反，请使用$（selector）.length>0。

@jrummell谢谢，编辑过。[0]引用数组或对象的变量后，将返回数组或对象中该索引处的值。在本例中，它要么返回DOM节点，要么返回未定义的节点。DOM节点是一个对象，因此等于

true

，而

undefined

始终等于

false

对于常规数组（第一个位置可能包含一个falsy值）是有缺陷的，但在这种情况下它确实有效。谢谢！我能问一下为什么第二个例子有缺陷吗？我编辑它以添加#。.length>0是比[0]更好的测试方法吗？我最近刚看到[0]，对这种方法很好奇。实际上我有点过于苛刻了。在这种情况下，这总是有效的（我更新了以显示这一点），但是对于普通数组，像0这样的值将返回false，即使它已定义。没有问题。谢谢你的详细解释。我看到了这个stackoverflow线程，accept的答案建议使用$（“#elementID”）[0]方法，这就是我好奇的原因。我以前没见过。非常感谢。在学习JS的同时，我一直在阅读数组，在另一个Stackoverflow线程中，我推荐了$（“#elementID'）[0]）方法（顶部答案见此处：）。谢谢你的解释。

var test = document.getElementById('test') //returns a HTML DOM Object
var test = $('#test') //returns a jQuery Object
var test = $('#test')[0] //returns a HTML DOM Object