JavaScript-Text ändern
-
Text eines Elements mit der Eigenschaft
textContentin JavaScript ändern -
Text eines Elements mit der Funktion
createTextNode()in JavaScript ändern
In diesem Tutorial wird erläutert, wie Sie den Text eines Elements mit der Eigenschaft textContent und der Funktion createTextNode() in JavaScript ändern.
Text eines Elements mit der Eigenschaft textContent in JavaScript ändern
Wenn Sie den alten Text eines Elements durch einen neuen Text ersetzen möchten, müssen Sie dieses Element mit seiner ID oder seinem Klassennamen abrufen und dann den alten Text mit dem neuen Text mit der Eigenschaft textContent ersetzen. Wenn keine ID oder kein Klassenname angegeben ist, können Sie dem Element mit dem Attribut id oder class eine ID oder einen Klassennamen geben. Stellen Sie sicher, dass die ID oder der Klassenname eindeutig ist. Andernfalls wird jedes Element mit derselben ID ebenfalls geändert. Lassen Sie uns zum Beispiel ein Textelement mit dem Tag span erstellen und seinen Text mit der Funktion textContent in JavaScript ändern. Siehe den Code unten.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<span id="SpanID"> Old Text </span>
<script type="text/javascript">
document.getElementById("SpanID").textContent="New Text";
</script>
</body>
</html>
Ausgabe:
New Text
Der JavaScript-Code wird im obigen Code in die HTML-Datei eingefügt, Sie können sie jedoch bei Bedarf trennen. Sie können auch die Bedingung angeben, unter der der Text geändert werden soll, indem Sie auf eine Schaltfläche klicken. Wenn Sie den Text nicht ersetzen möchten, sondern neuen Text mit dem alten Text anhängen möchten, können Sie die folgende Methode verwenden.
Text eines Elements mit der Funktion createTextNode() in JavaScript ändern
Wenn Sie den neuen Text mit dem alten Text anhängen möchten, müssen Sie dieses Element mit seiner ID oder seinem Klassennamen abrufen und dann mit der Funktion createTextNode() einen Knoten des neuen Textes erstellen und mit dem Befehl appendChild() Funktion können Sie den neuen Text an den alten Text anhängen. Wenn keine ID oder kein Klassenname angegeben ist, können Sie dem Element mit dem Attribut id oder class eine ID oder einen Klassennamen geben. Stellen Sie sicher, dass die ID oder der Klassenname eindeutig ist. Andernfalls wird jedes Element mit derselben ID ebenfalls geändert. Lassen Sie uns zum Beispiel ein Textelement mit dem Tag span erstellen und seinen Text mit der Funktion createTextNode() in JavaScript anhängen. Siehe den Code unten.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<span id="SpanID"> Old Text </span>
<script type="text/javascript">
Myspan = document.getElementById("SpanID");
Mytxt = document.createTextNode("New text");
Myspan.appendChild(Mytxt);
</script>
</body>
</html>
Ausgabe:
Old Text New Text
Wie Sie in der Ausgabe sehen können, wird der neue Text mit dem alten Text verkettet.
