Comment trouver avec javascript si l'élément existe dans les DOM ou virtuelle (qui vient d'être créé par createElement)

Je suis à la recherche d'un moyen de savoir si l'élément référencé dans le code javascript a été inséré dans le document.

Permet d'illustrer un cas avec le code suivant:

var elem = document.createElement('div');

//Element has not been inserted in the document, i.e. not present

document.getElementByTagName('body')[0].appendChild(elem);

//Element can now be found in the DOM tree

Jquery a :visible sélecteur, mais il ne vous donnera pas de résultat précis, quand j'ai besoin de trouver un invisible élément a été placé quelque part dans le document.

OriginalL'auteur mpontus | 2010-04-27

15

Voici une méthode plus simple qui utilise la norme Nœud.contient des API DOM à vérifier dans un élément est actuellement dans les DOM:
```
document.body.contains(MY_ElEMENT);
```
De la CROIX-NAVIGATEUR REMARQUE: l'objet document dans IE n'ont pas de contains() de la méthode pour assurer la compatibilité inter-navigateur, utilisez document.body.contains() à la place. (ou d'un document.tête.contient si vous êtes à la vérification des éléments comme lien, script, etc)

Notes sur l'aide d'un document de référence vs Nœud de niveau ownerDocument:

Quelqu'un a soulevé l'idée d'utiliser MY_ELEMENT.ownerDocument.contains(MY_ELEMENT) de vérifier pour un nœud de la présence dans le document. Tout ce peut produire le résultat souhaité (quoique, avec plus de verbosité que nécessaire dans 99% des cas), elle peut aussi conduire à des résultats inattendus, en fonction du cas d'utilisation. Parlons pourquoi:

Si vous faites affaire avec un nœud qui se trouve actuellement dans un document distinct, comme celui généré avec document.implementation.createHTMLDocument(), un <iframe> document, ou HTML d'un document d'Importation et d'utilisation du nœud ownerDocument de la propriété à vérifier la présence, dans ce que vous pense sera votre principal, visuellement rendu document, vous serez dans un monde de souffrance.

Le nœud de propriété ownerDocument est simplement un pointeur vers quelle que soit document actuel le nœud réside dans. Presque tous les cas d'utilisation de contains consiste à vérifier un spécifiques document pour un nœud en présence. Vous avez 0 de garantir que ownerDocument est le même document que vous souhaitez vérifier - que vous savez que. Le danger de ownerDocument est que quelqu'un peut introduire n'importe quel nombre de façons de référence, l'importation, ou de générer des nœuds qui se trouvent dans d'autres documents. S'ils le font, et vous avez écrit votre code de compter sur ownerDocument's par rapport à l'inférence, votre code peut le briser. Pour assurer votre code toujours produit les résultats escomptés, vous ne devriez comparer à la expressément mentionnés document vous avez l'intention de vérifier, pas de confiance, des inférences comme ownerDocument.

Les commentaires ne sont pas pour de longues discussions; cette conversation a été déplacé pour chat.

OriginalL'auteur csuwldcat
14

Ce faire:
```
var elem = document.createElement('div');
elem.setAttribute('id', 'my_new_div');

if (document.getElementById('my_new_div')) { } //element exists in the document.
```
Merci l'ami, j'ai eu cela à l'esprit, mais a été confondu par la possibilité d'avoir les id de collision. Minutes auparavant, j'ai développé de nouvelles méthode par vérification de l'élément parent du var. C'est certainement pas nouveau et je suis assez surpris que je n'ai pas pensé à elle avant.

OriginalL'auteur DexterW

Le plus sûr moyen est de tester directement si l'élément est contenu dans le document:

function isInDocument(el) {
    var html = document.body.parentNode;
    while (el) {
        if (el === html) {
            return true;
        }
        el = el.parentNode;
    }
    return false;
}

var elem = document.createElement('div');
alert(isInDocument(elem));
document.body.appendChild(elem);
alert(isInDocument(elem));

OriginalL'auteur Tim Down

1

Vous pouvez également utiliser jQuery.contient:
```
jQuery.contains( document, YOUR_ELEMENT)
```
OriginalL'auteur nitinkhuranas
-1

Utilisation compareDocumentPosition pour voir si l'élément est contenu à l'intérieur de document. PPK a la compatibilité du navigateur détails et John Resig a une version pour IE.

Je me demandais à propos de l'utilisation compareDocumentPosition trop, mais le déconner pour qu'il fonctionne dans tous les navigateurs ne semble pas vraiment la peine quand vous pouvez faire domething aussi simple que la marche jusqu'au nœud de l'arbre, comme dans ma réponse, qui va travailler dans à peu près tous les navigateurs.

OriginalL'auteur Jeffery To
-1
```
function isInDocument(query){
  return document.querySelectorAll(query).length != 0;
}
//isInDocument("#elemid") 
```
Cette question a été répondu il y a 7 ans. Peut-être vous voulez des précisions sur la façon dont votre réponse est plus précise aujourd'hui que quand il était à l'origine une réponse? Ne vous contentez pas de poster certains de code sans plus de détails, voir stackoverflow.com/help/how-to-answer.

OriginalL'auteur Sahan

Vous devez vous connecter pour publier un commentaire.