Как я могу определить, возвращает ли селектор ноль?

Question

Как лучше всего определить, возвращает ли jQuery-селектор пустой объект. Если вы делаете:

alert($('#notAnElement'));

вы получаете [объект объекта], поэтому способ, которым я делаю это сейчас:

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

, который будет писать "undefined", и вы можете проверить это. Но это выглядит очень плохо. Какой еще путь?

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' );

Answer 8

Вы можете сделать это все время по умолчанию. Я изо всех сил пытался обернуть функцию jquery или метод jquery.fn.init, чтобы сделать это без ошибок, но вы можете сделать простое изменение источника jquery, чтобы сделать это. Включены некоторые окружающие линии, которые вы можете искать. Я рекомендую поискать источник jquery для The jQuery object is actually just the init constructor 'enhanced'

var
  version = "3.3.1",

  // Define a local copy of jQuery
  jQuery = function( selector, context ) {

    // The jQuery object is actually just the init constructor 'enhanced'
    // Need init if jQuery is called (just allow error to be thrown if not included)
    var result = new jQuery.fn.init( selector, context );
    if ( result.length === 0 ) {
      if (window.console && console.warn && context !== 'failsafe') {
        if (selector != null) {
          console.warn(
            new Error('$(\''+selector+'\') selected nothing. Do $(sel, "failsafe") to silence warning. Context:'+context)
          );
        }
      }
    }
    return result;
  },

  // Support: Android <=4.0 only
  // Make sure we trim BOM and NBSP
  rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;

jQuery.fn = jQuery.prototype = {

И последнее, но не менее важное: вы можете получить несжатый исходный код jquery здесь: http://code.jquery.com/