Javascript-Ausgaben

Wiki-Quelltext dieser Seite.

<language>Javascript</language>
Eine html-Internetseite besteht immer aus mehreren Bestandteilen wie:
* Überschriften (h-Tag)
* Absätzen (p-Tag)
* Formularen (form-Tag)
* ...
Diese lassen sich aus Javascript heraus sehr leistungsstark wie komfortabel verändern ([http://de.wikipedia.org/wiki/Document_Object_Model] DOM]).
Eine besondere Art solcher Bestandteile sind so genannte div-Container (gegenüber den oben genannten, habe diese keinerlei besondere Funktionalität). Fügt man über html auf eine gewünschte Position seiner Seite

<pre>
...
 <div id="ausgabe1"><b>Hier ist der "div"-Container mit dem Namen <i>"ausgabe1"</i></b></div>
...
</pre>

ein, erhält man:

<div id="ausgabe1"><b>Hier ist der "div"-Container mit dem Namen <i>"ausgabe1"</i></b></div>

Benutze jeweils den Button "speichern & ausführen", um Beispiele zu sehen, wie leicht man aus Javascript heraus diesen div-Container ''ausgabe1'' manipulieren kann.

<run id="54e9e7a2428c3" readonly nooutput>
document.getElementById("ausgabe1").style.color = "red";
</run>

<run id="54e9e7a242935" readonly nooutput>
document.getElementById("ausgabe1").style.fontSize = "20px";
</run>

<run id="54e9e922e449e" readonly nooutput>
html="Test";
document.getElementById("ausgabe1").innerHTML = html;
</run>



Die Anweisung: <br><br> ''<b><font color="red">document</font>.getElementById("<font color="red">ausgabe1</font>").<font color="red">innerHTML </font>= html;''</b>  <br><br>bedeutet: <br>
* suche im Element ''<font color="red">document</font>''
* ein Element mit dem Namen ''<font color="red">ausgabe1</font>''
* Ändere die Eigenschaft ''<font color="red">innerhtml</font>'' (also was drin steht) auf
* den Wert der Variable html<br>

Siehe auch: [[Javascript-Ausgaben-Beispiel1]]