Як я можу виявити, якщо селектор повертає нуль?

Який найкращий спосіб виявити, якщо jQuery-селектор повертає порожній об’єкт. Якщо ти зробиш:

alert($('#notAnElement'));

ви отримуєте [object Object], так що я це роблю зараз:

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

який буде писати "невизначений", і ви можете зробити перевірку на це. Але це здається дуже поганим. Який ще спосіб?

Мій улюблений - розширити jQuery за допомогою цієї крихітної зручності:

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

Використовується як:

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

Більш чітке, ніж використання довжини.

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

Селектор повертає масив об’єктів jQuery. Якщо не знайдено відповідних елементів, він повертає порожній масив. Ви можете перевірити .lengthколекцію, повернуту селектором, або перевірити, чи не визначено перший елемент масиву.

Ви можете використовувати будь-які наведені нижче приклади всередині оператора IF, і всі вони дають однаковий результат. Щоправда, якщо селектор знайшов відповідний елемент, помилково інакше.

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

Мені подобається робити щось подібне:

$.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/

Мені подобається використовувати presence, натхненну Ruby on Rails :

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

Ваш приклад стає:

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

Я вважаю його вищим від запропонованого, $.fn.existsоскільки ви все ще можете використовувати ifбулі оператори або , але результат truthy є більш корисним. Ще один приклад:

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

Мої переваги, і я не маю поняття, чому цього ще немає в 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"

Це в документації JQuery:

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

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

Ви можете робити це постійно за замовчуванням. Я намагаюся завершити функцію 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/