Résumé
Renvoie une liste des éléments avec le nom de balise donné. La recherche se fait dans tout le document, y compris le nœud racine.
Syntaxe
elements = document.getElementsByTagName(nom)
Paramètres
elements
est une liste de nœuds (NodeList
) des éléments trouvés dans l'ordre dans lequel ils apparaissent dans l'arbre.nom
est une chaîne représentant le nom des éléments. La chaîne spéciale"*"
représente « tous les éléments ».
Exemple
Dans l'exemple qui suit, getElementsByTagName
part d'un élément parent particulier, et recherche en profondeur les éléments descendants portant un certain nom.
Notez que lorsque le nœud sur lequel getElementsByTagName
est appelé n'est pas le nœud document
, c'est en fait la méthode element.getElementsByTagName qui est utilisée.
<html> <head> <title>Exemple de getElementsByTagName</title> <script type="text/javascript"> function getAllParaElems() { var allParas = document.getElementsByTagName("p"); var num = allParas.length; alert("Il y a " + num + " éléments <p> dans ce document."); } function div1ParaElems() { var div1 = document.getElementById("div1") var div1Paras = div1.getElementsByTagName("p"); var num = div1Paras.length; alert("Il y a " + num + " éléments <p> dans l'élément div1."); } function div2ParaElems() { var div2 = document.getElementById("div2") var div2Paras = div2.getElementsByTagName("p"); var num = div2Paras.length; alert("Il y a " + num + " éléments <p> dans l'élément div2."); } </script> </head> <body style="border: solid green 3px"> <p>Un peu de texte à l'extérieur.</p> <p>Un peu de texte à l'extérieur.</p> <div id="div1" style="border: solid blue 3px"> <p>Un peu de texte dans div1.</p> <p>Un peu de texte dans div1.</p> <p>Un peu de texte dans div1.</p> <div id="div2" style="border: solid red 3px"> <p>Un peu de texte dans div2.</p> <p>Un peu de texte dans div2.</p> </div> </div> <p>Un peu de texte à l'extérieur.</p> <p>Un peu de texte à l'extérieur.</p> <button onclick="getAllParaElems();"> Compte les éléments p dans le document</button><br /> <button onclick="div1ParaElems();"> Compte les éléments p dans l'élément div1</button><br /> <button onclick="div2ParaElems();"> Compte les éléments p dans l'élément div2</button> </body> </html>
Spécification
- DOM Level 2 Core : getElementsByTagName — traduction (non normative)
Étiquettes et contributeurs liés au document
Dernière mise à jour par :
arunpandianp,