在空的 jQuery 选择器数组上返回“真”？

Question

我正在努力创建一种更语义化的方式来使用 jQuery 检查元素。使用 $("#element").length > 0 对我来说真的感觉不太好，所以我正在添加自己的选择器以在 .is 中使用：

if($("#element").is(":present")) {
  console.log("It's aliiiveeee!!");
}

这部分很简单，就像这样：

$.extend($.expr[':'],{
    present: function(a) {
        return $(a).length > 0;
    }
});

我想更进一步，使用类似的语法让查看元素是否不存在变得容易：

$.extend($.expr[':'],{
    present: function(a) {
        return $(a).length > 0;
    },
    absent: function(a) {
        return $(a).length === 0;
    }
});

$(function() {
  if($("#element").is(":absent")) {
    console.log("He's dead, Jim.");
  }
});

但这部分很难做到。我认为这是因为我正在缩减返回的元素以获得结果，并且将选择器缩减为 .length === 0 与要求没有 elelements 相同：无论如何它都会返回 false。

我尝试了很多不同的方法来反转事物，并在元素不存在时返回 true，如果存在则返回 false：

return $(a).length === 0;

return !($(a).length > 0);

if(!($(a).length > 0)) { 
  return true;
} 

if($(a).length > 0) { 
  return false;
} else {
  return true;
}

return !!($(a).length === 0);

// etc...

有没有一种简单的方法可以让它在元素不存在时返回 true，如果存在则返回 false？

Answer 1

0 在 JavaScript 中是“假的”。

你可以直接返回!$(a).length。

Answer 2

怎么样：

if ( !$(a)[0] ) {
    // $(a) is empty
}

所以，$(a)[0] 检索 jQuery 对象中的第一个元素。如果该元素为空/未定义，则表示 jQuery 对象为空。

Answer 3

is的定义：

根据选择器、元素或 jQuery 对象检查当前匹配的元素集，如果这些元素中至少有一个与给定参数匹配，则返回 true。

问题在于，由于您没有元素，因此您的元素之一不可能匹配某些条件。 jQuery 甚至没有调用你的代码，因为没有元素。

编辑：稍微澄清一下，您的代码会为对象中的每个元素调用一次（至少在返回 true 之前）。没有元素意味着代码永远不会被调用。 a 在您的代码中始终是一个元素。

EDIT2：考虑到这一点，这将是present 的更有效实现：

$.extend($.expr[':'],{
    present: function(a) {
        return true;
    }
});

Answer 4

你可以简单地使用

if(​$('element').length) // 1 or 0 will be returned

或

$.extend($.expr[':'],{
    present: function(a) {
        return $(a).length;
    }
});

if($('#element').is(':present'))
{
    // code for existence
}
else
{
    // code for non-existence
}

Example.

Answer 5

考虑到$().is() 在集合为空时甚至不会运行，:present 选择器相当多余。因此，与其玩$.expr[':']，不如扩展$.fn 以包含适当的功能，例如：

$.fn.extend({
    hasAny: function() {
        return this.length > 0;
    },
});

或

$.fn.extend({
    isEmpty: function() {
        return this.length == 0;
    },
});

我个人会采用这种方法的原因是选择器通常用于检查元素的特定属性（比较 :checked、:enabled、:selected、:hover 等），不是 jQuery 元素集的属性作为一个整体（例如.size()、.index()）。

用法当然类似于以下内容：

if ($('#element').isEmpty())
    console.log("He's dead, Jim.");