如何在jQuery中检查空对象

Question

我正在使用jQuery，并且想要检查页面中是否存在某个元素。我编写了以下代码，但它并没有起作用：

if($("#btext" + i) != null) {
    //alert($("#btext" + i).text());
    $("#btext" + i).text("Branch " + i);
}

如何检查元素是否存在？

- Prashant

Answer 1

请查看jQuery FAQ中的相关内容...

您可以使用选择器返回的 jQuery 集合对象的 length 属性：

if ( $('#myDiv').length ){}

- Christoph

---

你对以下代码有什么看法： var _myDiv = $('#myDiv'); ... .... if(_myDiv.length) {...} 会产生异常。 - Nuri YILMAZ

正如eleotlecram所说，最好避免使用.length。 - numediaweb

@AurelianoBuendia，您使用了 lenght 而不是 length，这是一个拼写错误。 - Sam

@numediaweb，eleotlecram并没有说要避免使用.length。 - Sam

但是你不会得到一个“无法读取 null 的 length 属性”的错误吗？ - Sagive

是的，我收到了一个 jquery.min.js:2 Uncaught TypeError: Cannot read property 'length' of null 错误信息。但是我没有在 jquery $ 对象上使用 length。 - Avatar

Answer 2

(由于我似乎没有足够的声望来反对答案...)

Wolf写道：

Calling length property on undefined or a null object will cause IE and webkit browsers to fail!

Instead try this:

 // NOTE!! THE FOLLOWING IS WRONG; DO NOT USE!  -- EleotleCram
if($("#something") !== null){
  // do something
}

or

 // NOTE!! THE FOLLOWING IS WRONG; DO NOT USE!  -- EleotleCram
if($("#something") === null){
  // don't do something
}

虽然在未定义或空对象上调用length属性会导致浏览器失败，但jQuery选择器（$（'...'））的结果永远不会为null或undefined。因此，代码建议毫无意义。使用其他答案，它们更有意义。

---

（2012年更新）因为人们查看代码并且这个答案排名很高：在过去的几年中，我一直在使用这个小插件：

  jQuery.fn['any'] = function() {
     return (this.length > 0);
  };

我认为 $('div').any() 比 $('div').length 更易读，而且您不必担心拼写错误： $('div').ayn() 会引发运行时错误，$('div').lenght 可能始终为假值而无声地失败。

__
2012年11月的编辑:

1）因为人们往往看代码而不是读周围的说明，所以我在 Wolf 的引用代码中添加了两个重要的注意事项。
2）我添加了一个小插件的代码，用于此情况。

- eleotlecram

---

@VovaPopov：我建议你下次花更多时间阅读答案。我只是在陈述“Wolf”的代码示例是不正确的事实。我从未提供过答案，只是参考了一些其他更有意义的答案。 - eleotlecram

好的回答。很抱歉人们误解了它。 - Joe Simmons

Answer 3

查找函数返回一个匹配元素的数组。您可以检查长度是否为零。请注意只查找元素一次并根据需要重复使用结果的更改。

var elem = $("#btext" + i);
if (elem.length != 0) {
   elem.text("Branch " + i);
}

此外，您尝试过只使用文本函数吗？如果没有元素存在，它将不执行任何操作。

$("#btext" + i).text("Branch " + i);

- tvanfosson

---

0是一个false值，所以elem.length的表达式会评估为false - 换句话说，'!= 0' 部分是不必要的。 - James

@999，我认为检查是否为零可以使代码更易读，尽管对于习惯于脚本语言的人来说，两种方式都很容易阅读。 - Sam

Answer 4

jQuery的$()函数总是返回非空值，这意味着匹配选择器条件的元素。如果找不到该元素，它将返回一个空数组。 因此你的代码将类似于：

if ($("#btext" + i).length){
        //alert($("#btext" + i).text());
    $("#btext" + i).text("Branch " + i);
}

- waney

---

我不认为$()返回一个数组是正确的。jQuery对象具有类似于数组的行为，但我不认为它们实际上是数组，并且您会发现它们的行为并不完全相同。请参见此快速演示：http://jsfiddle.net/CuR9z/。 - Sam

Answer 5

在jQuery 1.4中，你可以使用$.isEmptyObject函数。但是，如果你被迫使用旧版本的jQ（像我们这些可怜的Drupal开发人员一样），只需使用此代码：

// This is a function similar to the jQuery 1.4 $.isEmptyObject.
function isObjectEmpty(obj) {
  for ( var name in obj ) {
    return false;
  }
  return true;
}

使用方法如下：

console.log(isObjectEmpty(the_object)); // Returns true or false.

- theamoeba

---

这并没有回答问题。 - Sam

Answer 6

使用“undefined”怎么样？

if (value != undefined){ // do stuff } 

- Hugh Seagraves

Answer 7

无论你选择什么，$()函数总是返回一个jQuery对象，因此不能用来测试。目前最好的方法（如果不是唯一的方法）是使用size()函数或上述解释的本机长度属性。

if ( $('selector').size() ) {...}                   

- burntblark

Answer 8

if ( $('#whatever')[0] ) {...}

所有原生jQuery方法返回的jQuery对象并不是数组，它是一个拥有许多属性的对象；其中之一是“length”属性。您还可以检查size()、get(0)或get()——'get(0)'与访问第一个元素（即$(elem)[0]）相同。

- JimmyP

Answer 9

使用$("#selector").get(0) 进行检查，就像这样。get返回dom元素，在此之前您正在处理一个数组，需要检查长度属性。我个人不喜欢使用长度检查来处理空值，因为有些原因会使我感到困惑 :)

- Emre

---

不同的人有不同的思维方式，这很有趣；我认为检查元素数量是否为零比检查第一个元素是否存在更有意义。 - Sam

Answer 10

使用长度属性，您可以这样做。

jQuery.fn.exists = function(){return ($(this).length < 0);}
if ($(selector).exists()) { 
   //do somthing
}

- Suresh Pattu

---

你的意思是 (this).length > 0 吗？ - sage88