Auch wenn wir den Inhalt von HTML-Elementen auslesen und bearbeiten wollen, hilft uns JavaScript mit einfachen Umsetzungsmöglichkeiten weiter. Geht es uns nur um den Text innerhalb eines Elements und weitere HTML-Tags sollen ignoriert werden, dann ist die Eigenschaft innerText genau, was wir brauchen. Mit dem folgenden Codebeispiel wird ein Teil der beiden Überschriften (der Inhalt des em-Elements) vertauscht.
<body>
<h2><em id="ueberschrift1">Jubelnde</em> Schweizer</h2>
<h2><em id="ueberschrift2">Jodelnde</em> Sportler</h2>
<script>
var ueberschrift1 = document.getElementById("ueberschrift1").innerText;
document.getElementById("ueberschrift1").innerText = document.getElementById("ueberschrift2").innerText;
document.getElementById("ueberschrift2").innerText = ueberschrift1;
</script>
</body>Während die Eigenschaft innerText wirklich nur den Text aus dem HTML-Element verwendet, kann über die Eigenschaft innerHTML auf den kompletten HTML-Inhalt des Elements zugegriffen werden. Das folgende Codebeispiel füllt einen davor leeren HTML-Tag mit weiterem HTML-Code.
<body>
<p id="absatz"></p>
<script>
var neuerCode = "<em>Jadegrüne</em> Seide harmoniert toll mit <strong>Larimaren</strong>.";
document.getElementById("absatz").innerHTML = neuerCode;
</script>
</body>Aufgabe
Erstelle ein Skript, das im ganzen HTML-Dokument jeden b-Tag durch einen strong-Tag ersetzt, die Inhalte aber nicht verändert.