Meilleure façon de savoir si l'élément est un descendant d'un autre

Question

Je suis en train d'implémenter JQuery et de sortir des bibliothèques de prototypes dans mon code, et je me demande si vous pourriez me donner le meilleur moyen d'implémenter cette fonctionnalité dans jQuery. Je connais bien l'ancêtre jQuery> descendant sntax, mais je veux juste vérifier si un élément est un descendant par true ou false, comme dans le code ci-dessous: quelqu'un peut-il me donner la solution la plus efficace pour cela? Merci!

 <div id="australopithecus">
  <div id="homo-herectus">
    <div id="homo-sapiens"></div>
  </div>
</div>

$('homo-sapiens').descendantOf('australopithecus');
// -> true

$('homo-herectus').descendantOf('homo-sapiens');
// -> false
 

Answer 1

En jQuery 1.6, vous pouvez utiliser le code suivant, de manière générique, par exemple targetElt et parentElt peuvent être à la fois des éléments du DOM ou jQuery-enveloppé des objets, ainsi que les sélecteurs:

$(targetElt).closest(parentElt).length > 0

Certains des autres réponses besoin de vous référer à des éléments par leur Id, ce qui n'est pas utile si vous ne disposez que d'un élément du DOM sans un ID. Aussi, si vous voulez assurez-vous que le targetElt est une stricte descendant de parentElt (en d'autres termes, vous ne voulez pas compter parentElt comme son propre descendant), assurez-vous d'ajouter un targetElt != parentElt vérifier avant votre appel à l' .closest(), ou utiliser .parents().find() de Jonathan Sampson suggère.

Answer 2

Avec jQuery >=1.4 (2010) vous pouvez utiliser le très rapide de la fonction jQuery.contient du (de la)

Cette méthode statique fonctionne avec des éléments du DOM, pas avec jQuery éléments et les retours true ou false.

jQuery.contains( container, descendant )

Exemple: Pour vérifier si un élément est dans le document que vous pourriez faire ceci:

jQuery.contains( document.body, myElement )

Mise à jour:

Il y a aussi un natif méthode DOM Nœud.contains() que tous les navigateurs depuis ie5+ prend en charge. De sorte que vous pouvez le faire sans jQuery:

document.body.contains( myElement )

Answer 3

Je pense que vous pourriez profiter de la sélection de style CSS ici, avec une longueur renvoyée.

 $('#australopithecus #homo-sapiens').length // Should be 1
$('#homo-sapiens #homo-herectus').length // Should be 0
 

Pas tout à fait vrai / faux, mais vérifier 0/1 en tant que booléen devrait fonctionner. :)

Alternativement, vous pouvez faire quelque chose comme $ ('# parent'). Find ('# enfant') et vérifier la longueur.

Answer 4

Que diriez-vous

 
$("#homo-herectus").parents().is("#australopithecus");
 

Answer 5

Vous pouvez utiliser la fonction is() comme suit:

 alert($('#homo-sapiens').is('#australopithecus *'));
// -> true

alert($('#homo-herectus').is('#homo-sapiens *'));
// -> false