Comment puis-je détecter si un sélecteur renvoie null?

Quelle est la meilleure façon de détecter si un sélecteur jQuery renvoie un object vide. Si tu fais:

alert($('#notAnElement')); 

vous obtenez [Object Object], donc la façon dont je le fais est maintenant:

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

qui va écrire “indéfini”, et vous pouvez donc faire une vérification pour cela. Mais cela semble très mauvais. Quel autre moyen existe-t-il?

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.

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

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

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

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

J’aime faire quelque chose comme ça:

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

Donc, vous pouvez faire quelque chose comme ceci:

 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/

J’aime utiliser la presence , inspirée 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 aux $.fn.exists car vous pouvez toujours utiliser des opérateurs booléens ou if , mais le résultat est plus utile. Un autre exemple:

 $ul = $elem.find('ul').presence() || $('
    ').appendTo($elem) $ul.append('...')

Ma préférence, et je n’ai aucune idée de la raison pour laquelle ce 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, en regardant dans CoffeeScript:

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

Ceci est dans la documentation JQuery:

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

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