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".
<!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; ...