Heim >Web-Frontend >js-Tutorial >Grundlegende JavaScript-Ausgabe und eingebettetes Schreib-Tutorial_Grundkenntnisse

Grundlegende JavaScript-Ausgabe und eingebettetes Schreib-Tutorial_Grundkenntnisse

WBOY
WBOYOriginal
2016-05-16 15:36:021233Durchsuche

JavaScript verfügt über keine Druck- oder Ausgabefunktionen.
In HTML wird JavaScript häufig zum Bearbeiten von HTML-Elementen verwendet.
HTML-Elemente bearbeiten
Um über JavaScript auf ein HTML-Element zuzugreifen, können Sie die Methode document.getElementById(id) verwenden.
Bitte verwenden Sie das Attribut „id“, um HTML-Elemente zu identifizieren, und innerHTML, um Elementinhalte abzurufen oder einzufügen:
Beispiel

<!DOCTYPE html>
<html>
<body>

<h1>我的第一个 Web 页面</h1>

<p id="demo">我的第一个段落</p>

<script>
document.getElementById("demo").innerHTML = "段落已修改。";
</script>

</body>
</html>

Die obige JavaScript-Anweisung (im 3f1c4e4b6b16bbbd69b2ee476dc4f83a-Tag) kann in einem Webbrowser ausgeführt werden:

  • document.getElementById("demo") ist JavaScript-Code, der das id-Attribut verwendet, um ein HTML-Element zu finden.
  • innerHTML = „Absatz geändert.“ ist der JavaScript-Code, der zum Ändern des HTML-Inhalts (innerHTML) des Elements verwendet wird.

In HTML-Dokument schreiben
Zu Testzwecken können Sie JavaScript direkt in das HTML-Dokument schreiben:
Beispiel

<!DOCTYPE html>
<html>
<body>

<h1>我的第一个 Web 页面</h1>

<p>我的第一个段落。</p>

<script>
document.write(Date());
</script>

</body>
</html>

Bitte verwenden Sie document.write(), um nur Inhalte in das Dokument zu schreiben.
Wenn document.write ausgeführt wird, nachdem das Dokument vollständig geladen wurde, wird die gesamte HTML-Seite überschrieben.
Beispiel

<!DOCTYPE html>
<html>
<body>

<h1>我的第一个 Web 页面</h1>

<p>我的第一个段落。</p>

<button onclick="myFunction()">点我</button>

<script>
function myFunction() {
document.write(Date());
}
</script>

</body>
</html>

Auf Konsole schreiben
Wenn Ihr Browser das Debuggen unterstützt, können Sie die Methode console.log() verwenden, um JavaScript-Werte im Browser anzuzeigen.
Verwenden Sie F12 im Browser, um den Debug-Modus zu aktivieren, und klicken Sie im Debug-Fenster auf das Menü „Konsole“.
Beispiel

<!DOCTYPE html>
<html>
<body>

<h1>我的第一个 Web 页面</h1>

<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>

</body>
</html>

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn