document.getElementsByTagName
=============================

Renvoie une `HTMLCollection` des éléments avec le nom de balise donné. Le document complet est recherché, y compris le nœud racine. Le `HTMLCollection` renvoyée est en direct, ce qui signifie qu'elle se met à jour automatiquement pour rester synchronisée avec l'arborescence DOM sans avoir à rappeler document.getElementsByTagName ().

Syntaxe
-------


```js
var elements = document.getElementsByTagName(name);
```


* `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 ».

**Note :** La dernière spécification W3C dit que `elements` est une `HTMLCollection` ; cependant cette méthode renvoie une `NodeList` dans les navigateurs WebKit. Voir bug Firefox 14869 pour plus de détails.

Exemple
-------

Dans l'exemple suivant, `getElementsByTagName()` commence à partir d'un élément parent particulier et effectue une recherche descendante récursive dans le DOM à partir de cet élément parent, en créant une collection de tous les éléments descendants qui correspondent au paramètre de `name`. Cela démontre à la fois `document.getElementsByTagName()` et son homologue `Element.getElementsByTagName ()`, qui lance la recherche sur un élément spécifique dans l'arbre DOM.

Cliquer sur les boutons utilise `getElementsByTagName()` pour compter les éléments de paragraphe descendant d'un parent particulier (le document lui-même ou l'un des éléments `<div>` imbriqués).


```html
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>getElementsByTagName example</title>
    <script>
 function getAllParaElems() {
 var allParas = document.getElementsByTagName("p");
 var num = allParas.length;
 alert("There are " + num + " paragraph in this document");
 }

 function div1ParaElems() {
 var div1 = document.getElementById("div1");
 var div1Paras = div1.getElementsByTagName("p");
 var num = div1Paras.length;
 alert("There are " + num + " paragraph in #div1");
 }

 function div2ParaElems() {
 var div2 = document.getElementById("div2");
 var div2Paras = div2.getElementsByTagName("p");
 var num = div2Paras.length;
 alert("There are " + num + " paragraph in #div2");
 }
 </script>
  </head>
  <body style="border: solid green 3px">
    <p>Some outer text</p>
    <p>Some outer text</p>

    <div id="div1" style="border: solid blue 3px">
      <p>Some div1 text</p>
      <p>Some div1 text</p>
      <p>Some div1 text</p>

      <div id="div2" style="border: solid red 3px">
        <p>Some div2 text</p>
        <p>Some div2 text</p>
      </div>
    </div>

    <p>Some outer text</p>
    <p>Some outer text</p>

    <button onclick="getAllParaElems();">show all p elements in document</button
 ><br />

    <button onclick="div1ParaElems();">
      show all p elements in div1 element</button
 ><br />

    <button onclick="div2ParaElems();">
      show all p elements in div2 element
    </button>
  </body>
</html>
```

Notes
-----

Lorsqu'elle est appelée sur un document HTML, `getElementsByTagName()` classe son argument avant de continuer. Cela n'est pas souhaitable lorsque vous essayez de faire correspondre des éléments camelCase SVG dans un sous-arbre dans un document HTML. `document.getElementsByTagNameNS ()` est utile dans ce cas. Voir aussi le bug Firefox 499656.

`document.getElementsByTagName()` est similaire à `element.getElementsByTagName ()`, sauf que sa recherche englobe tout le document.

Spécifications
--------------

* DOM Level 2 Core : getElementsByTagName — traduction (non normative)
* HTML 5: APIs in HTML documents
Voir aussi
----------

* `Element.getElementsByTagName()`
* `document.getElementById()` pour renvoyer une référence à un élément par son `id` (*identifiant*)
* `document.getElementsByName()` pour renvoyer une référence à un élément par son `name` (*nom*)
* `document.querySelector()` pour les sélecteurs puissants via des requêtes comme `'div.myclass'`