2009-06-22 4 views
23

Généralement en JavaScript je fais quelque chose comme ci-dessous pour vérifier un élément existe:Comment vérifier qu'un élément existe dans le DOM en utilisant jQuery?

if (document.getElementById('lblUpdateStatus')) { 
    $("#lblUpdateStatus").text(""); 
} 

Mais, en utilisant jQuery - comment puis-je faire le même genre de chose?

+0

Dupe: http://stackoverflow.com/questions/950563/how-to-find-detect-any-textarea-in-page-using-jquery/950574#950574 – karim79

Répondre

17

La méthode get renvoie les éléments DOM matched:

if($("#lblUpdateStatus").get(0)){ 
    $("#lblUpdateStatus").click(function() { ... }); 
} 

mais je ne suis pas sûr que ce soit une méthode rapide.

16

La chose est que le jQuery ne le fera que l'action demandée si l'élément existe :-), donc il vous suffit:

$("#lblUpdateStatus").text(""); 
28

$ retourne un tableau d'éléments correspondant, donc vérifier la propriété de longueur et vous êtes bon pour aller

if ($('#lblUpdateStatus').length) { 
    $("#lblUpdateStatus").text(""); 
} 
11

Je ne vois aucune raison d'utiliser jQuery juste pour le plaisir. le $('#lblUpdateStatus') ira directement à document.getElementById('lblUpdateStatus'), car le sélecteur a une ancre dedans, donc vous ne gagnez vraiment rien. En outre, pour vérifier simplement si l'objet DOM existe, l'encapsuler dans un objet jQuery va créer beaucoup de surcharge. En revanche, si vous ne voulez que modifier la propriété text de l'objet, vous n'avez pas besoin de vérifier son existence si vous utilisez jQuery.

if (document.getElementById('lblUpdateStatus')) { 
    $("#lblUpdateStatus").text(""); 
} 

fera exactement la même chose que juste après avoir

$("#lblUpdateStatus").text(""); 
+0

document.getElementById ('lblUpdateStatus ') se lit mieux aussi. – Kieran

+1

il est beaucoup plus rapide comme vous le dites http://jsperf.com/test-dom-selector – Kieran

+1

@Kieran: 'document.getElementById ('lblUpdateStatus')' pourrait être plus facile à lire (je ne pense pas, mais je devinez que c'est une question d'habitude), mais vous risquez de courir dans des erreurs de référence nulles si vous essayez de faire quelque chose avec ce que cette déclaration renvoie, et il n'y a pas un tel élément sur la page. Dans ce cas, la méthode jQuery ne fait rien en silence (ce qui pourrait ou non être ce que l'OP voulait ...) –

3

J'ai écrit un message à ce sujet sur my blog

if ($('#element_id').length > 0) 
    console.log('the element with element_id exists in the DOM'); 
+0

Ce qui est la même chose que if ($ ('# element_id'). Length) {console.log ('l'élément avec element_id existe dans le DOM'); } (Essentiellement la réponse de DanF ci-dessus.) – Nosredna

3

Si la chaîne HTML peut être passé dans $(), vous pouvez utiliser parent.length:

$('<div>').length // 1, but it not exist on page 

mais

$('<div>').parent().length // 0 
9

A partir jQuery 1.4 partir vous pouvez utiliser $.contains().

var test = $("<div>"); 
$.contains(window.document, test[0]); // false 

$("body").append(test); 
$.contains(window.document, test[0]); // true 
+0

Les autres réponses fonctionnent pour la question posée, mais c'est la seule qui fonctionne si vous voulez vérifier si un ancien élément auquel vous avez une référence existe toujours dans le dom. – jstaab

Questions connexes