So rufen Sie mehrere Texte unter Javascript-Tags ab

JavaScript kann als häufig verwendete Skriptsprache Webentwicklern dabei helfen, HTML-Text einfach zu bearbeiten. Wenn wir mehrere Textinhalte unter einem Label abrufen müssen, können wir dazu einige einfache JavaScript-Methoden und -Anweisungen verwenden.

Verwenden Sie das innerHTML-Attribut

In JavaScript können wir das innerHTML-Attribut verwenden, um den Textinhalt unter dem HTML-Tag abzurufen. Das innerHTML-Attribut kann den gesamten im Tag enthaltenen Text abrufen, einschließlich des Textinhalts verschachtelter Tags.

Angenommen, wir haben eine solche HTML-Struktur:

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

Wir können den folgenden Code verwenden, um den Textinhalt unter allen p-Tags abzurufen:

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

console.log(innerText);

Das Ausgabeergebnis ist:

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

Aber es sollte beachtet werden, dass die Das innerHTML-Attribut erhält nicht nur den Textinhalt, sondern auch die Elemente des Tags selbst, einschließlich der Attribute und Ereignisse im Tag. Wenn Sie daher das innerHTML-Attribut zum Abrufen des Textinhalts verwenden, müssen Sie die HTML-Elemente im Tag entfernen Taggen Sie zuerst, um den gewünschten Text zu erhalten.

Verwenden Sie das innerText-Attribut

Zusätzlich zum innerHTML-Attribut können wir auch das innerText-Attribut verwenden, um den Klartextinhalt unter dem HTML-Tag abzurufen. Dabei wird das HTML-Tag ignoriert und nur der Textinhaltsteil zurückgegeben. Diese Eigenschaft kann nur den Textinhalt innerhalb des aktuellen Elements abrufen, nicht den Textinhalt seiner untergeordneten Elemente.

Wenn wir also mehrere Textinhalte unter HTML-Tags abrufen möchten, müssen wir eine for-Schleife verwenden, um das innerText-Attribut der untergeordneten Elemente nacheinander abzurufen. Zum Beispiel:

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);

Das Ausgabeergebnis ist:

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

Verwendung des textContent-Attributs

Zusätzlich zu den beiden oben genannten Methoden können wir auch das textContent-Attribut verwenden, um den Textinhalt unter dem HTML-Tag abzurufen. Anders als innerText ruft das textContent-Attribut alle Textknoten unter der Beschriftung ab, einschließlich aller Leerzeichen und Zeilenumbrüche innerhalb der Beschriftung.

Wenn wir mehrere Textinhalte unter HTML-Tags abrufen möchten, müssen wir ebenfalls eine for-Schleife verwenden, um die textContent-Attribute der untergeordneten Elemente nacheinander abzurufen. Zum Beispiel:

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);

Das Ausgabeergebnis ist:

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

Zusammenfassend bietet JavaScript eine Vielzahl von Methoden, um den Textinhalt unter dem HTML-Tag abzurufen. Wählen Sie einfach die für Sie geeignete Methode aus, um den gewünschten Textinhalt zu erhalten.

Das obige ist der detaillierte Inhalt vonSo rufen Sie mehrere Texte unter Javascript-Tags ab. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!