如何检测选择器是否返回null？

Question

检测jQuery-selector是否返回空对象的最佳方法是什么.如果你这样做:

alert($('#notAnElement'));

你得到[object Object],所以我现在这样做的方式是:

alert($('#notAnElement').get(0));

这将编写"未定义",因此您可以检查它.但看起来非常糟糕.还有什么其他方式？

Answer 1

我最喜欢的是使用这个极小的便利来扩展jQuery:

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

使用如下:

$("#notAnElement").exists();

比使用长度更明确.

Answer 2

if ( $("#anid").length ) {
  alert("element(s) found")
} 
else {
  alert("nothing found")
}

Answer 3

选择器返回一个jQuery对象数组.如果未找到匹配的元素,则返回空数组.您可以检查.length选择器返回的集合,或检查第一个数组元素是否为"未定义".

您可以在IF语句中使用以下任何示例,它们都会产生相同的结果.如果选择器找到匹配元素,则为true,否则为false.

$('#notAnElement').length > 0
$('#notAnElement').get(0) !== undefined
$('#notAnElement')[0] !== undefined

Answer 4

我喜欢做这样的事情:

$.fn.exists = function(){
    return this.length > 0 ? this : false;
}

那么你可以这样做:

var firstExistingElement = 
    $('#iDontExist').exists() ||      //<-returns false;
    $('#iExist').exists() ||          //<-gets assigned to the variable 
    $('#iExistAsWell').exists();      //<-never runs

firstExistingElement.doSomething();   //<-executes on #iExist

http://jsfiddle.net/vhbSG/

Answer 5

我喜欢使用presence,灵感来自Ruby on Rails:

$.fn.presence = function () {
    return this.length !== 0 && this;
}

你的例子变成:

alert($('#notAnElement').presence() || "No object found");

我发现它优于提议的$.fn.exists因为你仍然可以使用布尔运算符if,但是真实的结果更有用.另一个例子:

$ul = $elem.find('ul').presence() || $('<ul class="foo">').appendTo($elem)
$ul.append('...')

Answer 6

我的偏好,我不知道为什么这还没有在jQuery中:

$.fn.orElse = function(elseFunction) {
  if (!this.length) {
    elseFunction();
  }
};

像这样使用:

$('#notAnElement').each(function () {
  alert("Wrong, it is an element")
}).orElse(function() {
  alert("Yup, it's not an element")
});

或者,在CoffeeScript中看起来:

$('#notAnElement').each ->
  alert "Wrong, it is an element"; return
.orElse ->
  alert "Yup, it's not an element"

Answer 7

这是在JQuery文档中:

http://learn.jquery.com/using-jquery-core/faq/how-do-i-test-whether-an-element-exists/

  alert( $( "#notAnElement" ).length ? 'Not null' : 'Null' );