Comment récupérer une balise HTML contenue dans une autre balise en JavaScript ?

Réponses rédigées par Antoine
Dernière mise à jour : 2022-03-31 13:47:38
Thèmes : javascript - html
Question

Bonjour, comment faire pour récupérer le second paragraphe qui est contenu dans la balise <div> :

<div id="bloc">
  <p>Contenu du premier paragraphe</p>
  <p>Contenu du second paragraphe</p>
  <p>Contenu du troisième paragraphe</p>
</div>
Réponse

Pour récupérer une balise HTML contenue dans une autre balise, en JavaScript, vous pouvez utiliser la méthode Element.getElementsByTagName() de la manière suivante :

<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Comment récupérer une balise HTML contenue dans une autre balise en JavaScript ?</title>
</head>
<body>
<div id="bloc">
  <p>Contenu du premier paragraphe</p>
  <p>Contenu du second paragraphe</p>
  <p>Contenu du troisième paragraphe</p>
</div>
<script>
var bloc = document.getElementById("bloc");
var paragraphe_1 = bloc.getElementsByTagName("p")[0];
var paragraphe_2 = bloc.getElementsByTagName("p")[1];
var paragraphe_3 = bloc.getElementsByTagName("p")[2];
alert("Objet paragraphe 2: " +  paragraphe_2 + " et Contenu du paragraphe 2: " + paragraphe_2.innerHTML);
</script>
</body>
</html>

Vous trouverez d'avantage d'information sur la méthode Element.getElementsByTagName(), et sur la manière de récupérer une balise HTML contenue dans une autre balise, via cette page du site de Mozilla.