Les sélecteurs hiérarchiques

La notation DOM avec ses parents, descendants, enfants, frères et sœurs (siblings) est maintenant bien ancrée dans l’écriture du JavaScript. La librairie jQuery exploite ces possibilités.

1. Sélection des descendants

$("ascendant descendant")

Sélectionne tous les descendants de l’élément noté "descendant" par rapport à l’élément parent noté "ascendant".

$("#box p") : sélectionne tous les descendants de <p> contenus dans l’élément ascendant identifié par box.

Les descendants peuvent être les enfants, les petits-enfants et les arrière-petits-enfants.

Exemple

Soient des divisions qui contiennent divers éléments. Retrouvons tous les descendants de l’élément identifié par id="box".

images/C02-036.png

<!doctype html> 
<html lang="fr"> 
<head> 
<meta charset="utf-8"> 
<title>jQuery</title> 
<script src="jquery.js"></script> 
<script> 
    $(document).ready(function() { 
        $("#box *").css("border", "2px dashed black"); 
    }); 
</script> 
<style> 
    span#box { 
        display: block; ...
couv_EI4JQU.png

Découvrez 

le livre :

Aussi inclus dans nos :

Précédent
Les sélecteurs de base
Suivant
Les filtres jQuery de base