15

我正在努力创建一种更语义化的方式来使用 jQuery 检查元素。使用$("#element").length > 0just 对我来说真的感觉不太好，所以我正在制作自己的选择器添加用于.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？

4

5 回答 5

14

的定义is：

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

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

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

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

$.extend($.expr[':'],{
    present: function(a) {
        return true;
    }
});
于 2012-04-15T21:10:55.297 回答
6

你可以简单地使用

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
}

例子。

于 2012-04-15T21:13:07.897 回答
2

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

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

或者

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

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

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

if ($('#element').isEmpty())
    console.log("He's dead, Jim.");
于 2012-04-16T08:31:23.313 回答
1

0在 JavaScript 中是“虚假的”。

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

于 2012-04-15T21:07:53.433 回答
0

怎么样：

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

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

于 2012-04-15T21:10:25.027 回答