web-dev-qa-db-fra.com

Comment détecter si un sélecteur renvoie null?

Quel est le meilleur moyen de détecter si un sélecteur jQuery renvoie un objet vide. Si tu fais:

alert($('#notAnElement'));

vous obtenez [objet Objet], donc je le fais maintenant comme suit:

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

qui écrira "indéfini", et vous pourrez donc vérifier cela. Mais cela semble très mauvais. Quel autre moyen y a-t-il?

jqueryjquery-selectors
260
peirix

Mon préféré est d’étendre jQuery avec cette petite commodité:

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

Utilisé comme:

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

Plus explicite que d'utiliser la longueur.

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

Le sélecteur renvoie un tableau d'objets jQuery. Si aucun élément correspondant n'est trouvé, un tableau vide est renvoyé. Vous pouvez vérifier le .length de la collection renvoyée par le sélecteur ou vérifier si le premier élément du tableau est 'non défini'.

Vous pouvez utiliser any les exemples suivants dans une instruction IF et ils produisent tous le même résultat. True, si le sélecteur a trouvé un élément correspondant, false sinon.

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

J'aime faire quelque chose comme ça:

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

Alors vous pouvez faire quelque chose comme ça:

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/

39
CSharp

J'aime utiliser presence, inspiré de Ruby on Rails :

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

Votre exemple devient:

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

Je le trouve supérieur au _$.fn.exists_ proposé parce que vous pouvez toujours utiliser des opérateurs booléens ou if, mais le résultat de la vérité est plus utile. Un autre exemple:

_$ul = $elem.find('ul').presence() || $('<ul class="foo">').appendTo($elem)
$ul.append('...')
_
9
Marc-André Lafortune

Ma préférence, et je ne sais pas pourquoi cela n’est pas déjà dans jQuery:

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

Utilisé comme ceci:

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

Ou, comme il se présente dans CoffeeScript:

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

C’est dans la documentation de JQuery:

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

  alert( $( "#notAnElement" ).length ? 'Not null' : 'Null' );
6
Daniel De León