javascript检查DOM元素是否存在最佳实践

检查javascript中是否存在DOM元素的最佳实践是什么

是否应该在使用某个项目之前检查它是否存在，就像这样

if ($("#" + machineId + packageId.removeSpecialChars().toUpperCase() + "").size() != 0) {
  var row = $("#" + machineId + packageId.removeSpecialChars().toUpperCase() + "");
}

这不会执行两次

packageId.removeSpecialChars（）.toUpperCase（）

还是这是更好的选择

var row = $("#" + machineId + packageId.removeSpecialChars().toUpperCase() + ""); 
if (row)
{
  // do something
}

---

但是，如果找不到异常，它不会抛出异常吗？

一般编程约定说不要重复自己的操作。因此，在这种情况下，您至少可以只查找一次对象，并保留一个变量引用：

var thing = $("#" + machineId + packageId.removeSpecialChars().toUpperCase() + "");

这样，选择查找就不会发生两次，多余的方法调用被删除等。这还有一个好处，就是当您可以将变量命名为有意义的东西时，您可以编写更多的自解释代码，而不是

thing

，或者，eeek

a

（虽然代码不一定要更有意义，但人们仍然使用像

a

！）

---

至于多次调用方法，这通常是不可避免的。

确实如此，您需要的是：

var a = $("#" + machineId + packageId.removeSpecialChars().toUpperCase() + "");
if (a.size()) {
    var row = a;
}

最好缓存它：

var machId = $("#" + machineId + packageId.removeSpecialChars().toUpperCase());
if (machId.size() != 0) {
   var row = machId;
}

---

当您实际使用DOM元素时，那么是的，您应该在尝试使用它之前检查它是否存在，以避免JavaScript错误。但是，您使用的不是DOM元素，而是（可能）包含DOM元素的jQuery对象

jQuery函数已经处理了在其元素集中没有匹配项的情况，因此在尝试使用它们之前，您不需要显式地检查元素是否存在。只有在尝试使用

.get（）

函数或

[index]

方括号表示法从该集合中直接引用DOM元素时，才需要这样做

另外，jQuery函数在1.8版中被弃用，您应该直接使用jQuery对象的

length

属性来检查是否有元素，因此：

var $object = $('a-selector');
if($object.length) {
    // there's at least one matching element
}

---

基本上，您需要查看DOM元素是否存在于HTML中，但请记住，如果DOM中不存在该元素，jQuery不会抛出致命错误，但最好进行检查，它会在代码中添加一个更安全的层，有一个名为.size（）的东西从1.8版起被弃用，因此，即使您使用的是旧版本的jQuery，也不建议使用它，因此目前最好的解决方案是下面的代码：

if($('.class').length) { // check if any element with this class exist, if not exist, it return 0 and can not pass the if estatement
    // do something
}

---

从两行中删除此项

+“”

size（）

已被弃用…请使用

length

替换此项不正确。如果（$object.length>0），则它应该是

——即使对于未找到的选择器，它也会返回0@Archer“未找到的选择器”是什么意思？如果您的意思是选择器与任何元素都不匹配，那么是的，它将返回
0
，这正是我们想要的
0
是错误的，因此如果jQuery对象中没有任何元素，
if
条件将失败！谢谢Anthony-我从来不知道0在if语句中被解读为false。这就是为什么我要“纠正”你。感谢我今天学到的新东西。A + 1：）虽然安东尼是正确的，我认为这是坏的做法…它是一种隐式检测，在主检测和主检测中存在潜在的缺陷。。。换句话说，使用（$object.length>0）是一个直接针对点的问题。是的，在这种情况下使用>0要好得多。在JS中专门检查null被认为是不好的做法。只需检查这个东西是否存在，因为它也可能是未定义的，0或0false@Anzeo检查
null
或
undefined
，这不是我的观点。
if($('.class').length) { // check if any element with this class exist, if not exist, it return 0 and can not pass the if estatement
    // do something
}