javascript - 如何确定具有该 ID 的元素是否存在？

Question

我做一个：

console.log($('#test'));

我知道测试不存在。如果我执行 console.log，它不会输出 undefined/null。相反，它会输出类似于空数组的内容，当我检查该数组时，它看起来像是返回了 jQuery 对象本身。

我也试过：

if ($('#test')){
    //do something
}

但它仍然不起作用。我想知道我选择的 ID 是否存在于页面上。我如何使用 jQuery 做到这一点？

score 4 · Accepted Answer

这样做要快 20 倍：

if (document.getElementById("test"))

与 jQuery 操作相比，仅确定页面中是否存在具有该 id 的 DOM 对象。jQuery 可以为您做很多事情，但是当不需要它的通用选择器引擎和通用对象结构时，它并不是最快的处理方式。

正如其他人所说，$("#test")即使#test不存在，它也始终是有效的 jQuery 对象。如果#test对象不存在，那么$("#test")它将是一个 jQuery 对象，其中没有 DOM 对象（内部数组将有一个.length === 0），但它仍然是一个有效对象。

score 1 · Accepted Answer

将 '(' 和 ')' 用于 'if' 语句，并检查返回的数组的长度是否大于 0：

if ($('#test').length > 0){
    //do something
}

score 1 · Accepted Answer

利用

if ($('#test').length > 0){
    //do something
}

长度告诉你选择了多少项目，如果它是 0 没有元素有 id 测试。

score 1 · Accepted Answer

使用这样的东西

if ($('#test').length > 0){
    alert('hi')
  }else
  {
     alert('hello')
  }

score 1 · Accepted Answer

最好的方法是检查所选元素的长度

if ($('#test').length > 0){
    //do something
}

但是如果你想创建一个存在的函数 jQuery 欢迎你只需在脚本中添加该行

jQuery.fn.exists = function(){return this.length>0;}

现在您可以检查元素是否存在

if ($(selector).exists()) {
  // Do something
}

score 1 · Accepted Answer

在 JavaScript 中，对象总是真实的，所以以这种方式使用它总是会通过条件。

你需要检查length财产。的响应0是falsy，并且会按预期工作。

if ($('#test').length) { 
    // ...    
}

这与不同，如果具有该属性的元素不存在document.getElementById()，则返回。nullid

如果这令人困惑，您总是可以编写一个快速的 jQuery 插件。

$.fn.exists = function() {
    return !!this.length;
};

然后，您可以调用exists()jQuery 集合，以确保选择器至少匹配一个项目。

score 0 · Accepted Answer

console.log($('#test'));

这不会打印该值，因为它表示在 DOM 中找到的带有 id 测试的对象。如果要获取值，请使用 $("#test").val(); 或 $("#test").html();

如果要检查是否存在，请按照上面的建议进行长度测试。

此外，如果您正在测试是否存在生成的元素（您添加到 DOM 的东西），请确保您签出 .live (http://api.jquery.com/live/)。这对于在页面加载后创建的所有元素都是必需的。

7 回答 7