Comment récupérer plusieurs textes sous balises javascript

JavaScript, en tant que langage de script couramment utilisé, peut aider les développeurs Web à manipuler facilement le texte HTML. Lorsque nous devons obtenir plusieurs contenus textuels sous une étiquette, nous pouvons utiliser des méthodes et instructions JavaScript simples pour y parvenir.

Utiliser l'attribut innerHTML

En JavaScript, nous pouvons utiliser l'attribut innerHTML pour obtenir le contenu du texte sous la balise HTML. L'attribut innerHTML peut récupérer tout le texte contenu dans la balise, y compris le contenu textuel des balises imbriquées.

Par exemple, supposons que nous ayons une telle structure HTML :

<div id="container">
  <p>这是第一段文本</p>
  <p>这是第二段文本</p>
  <p>这是第三段文本</p>
</div>

Nous pouvons utiliser le code suivant pour obtenir le contenu du texte sous toutes les balises p :

var container = document.getElementById("container");
var innerText = container.innerHTML;

console.log(innerText);

Le résultat de sortie est :

<p>这是第一段文本</p>
<p>这是第二段文本</p>
<p>这是第三段文本</p>

Mais il convient de noter que le L'attribut innerHTML obtiendra non seulement le contenu du texte, mais également les éléments de la balise elle-même, y compris les attributs et les événements de la balise. Par conséquent, lorsque vous utilisez l'attribut innerHTML pour obtenir le contenu du texte, vous devez supprimer les éléments HTML de la balise. balisez d’abord pour obtenir le texte souhaité.

Utilisez l'attribut innerText

En plus de l'attribut innerHTML, nous pouvons également utiliser l'attribut innerText pour obtenir le contenu en texte brut sous la balise HTML, il ignorera la balise HTML et ne renverra que la partie du contenu du texte. Cette propriété ne peut obtenir que le contenu textuel de l'élément actuel, pas le contenu textuel de ses éléments enfants.

Donc, si nous voulons obtenir plusieurs contenus de texte sous des balises HTML, nous devons utiliser une boucle for pour obtenir l'attribut innerText des éléments enfants un par un. Par exemple :

var container = document.getElementById("container");
var paragraphs = container.getElementsByTagName("p");
var innerText = "";

for (var i = 0; i < paragraphs.length; i++) {
  innerText += paragraphs[i].innerText + "
";
}

console.log(innerText);

Le résultat de sortie est :

这是第一段文本
这是第二段文本
这是第三段文本

Utilisation de l'attribut textContent

En plus des deux méthodes ci-dessus, nous pouvons également utiliser l'attribut textContent pour obtenir le contenu du texte sous la balise HTML. Différent de innerText, l'attribut textContent obtiendra tous les nœuds de texte sous l'étiquette, y compris tous les espaces et nouvelles lignes au sein de l'étiquette.

De même, si nous voulons obtenir plusieurs contenus de texte sous des balises HTML, nous devons utiliser une boucle for pour obtenir les attributs textContent des éléments enfants un par un. Par exemple :

var container = document.getElementById("container");
var paragraphs = container.getElementsByTagName("p");
var textContent = "";

for (var i = 0; i < paragraphs.length; i++) {
  textContent += paragraphs[i].textContent + "
";
}

console.log(textContent);

Le résultat de sortie est :

这是第一段文本
这是第二段文本
这是第三段文本

Pour résumer, JavaScript fournit une variété de méthodes pour obtenir le contenu du texte sous la balise HTML. Choisissez simplement la méthode appropriée en fonction de vos besoins pour obtenir le contenu textuel requis.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!