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 } 

但是，如果找不到它会不会抛出exception？

Answer 1

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

jQuery函数已经处理了其元素集中没有匹配项的情况，因此在尝试使用它们之前，您不需要自己检查是否存在元素。 如果您尝试使用.get()函数或[index]方括号表示法直接从该集合内部引用DOM元素，则只需要这样做。

.size() ， .size() jQuery函数在1.8版本中已被弃用，你应该直接使用jQuery对象的length属性来检查是否有元素，所以：

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

Answer 2

最好缓存它：

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

Answer 3

一般编程惯例说不要重复自己 。 因此，在这种情况下，您至少可以只查找一次该事物并保留变量引用：

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

然后选择查找不会发生两次，删除冗余方法调用等。这样做的好处是可以让你编写更多不言自明的代码，当你可以将变量命名为有意义的东西，而不是thing ，或者eeek！ ， a （虽然它不一定是代码必须更有意义，人们仍然使用像！的名字！）

 if (thing != null) { } if (thing.size() != 0) { } etc. 

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

Answer 4

它确实，你需要的是：

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

Answer 5

您基本上需要查看您的HTML中是否存在DOM元素，但请注意，如果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 }