Heim > Artikel > Web-Frontend > Ausführliche Erläuterung der Kombination von JavaScript und HTML
Ausführliche Erläuterung der Kombination von JavaScript und HTML
- 不言Original
- 2018-05-07 15:51:182154Durchsuche
In diesem Artikel wird hauptsächlich die Methode zum Kombinieren von JavaScript und HTML vorgestellt. Der Inhalt ist sehr detailliert.
HTML Das JavaScript-Skript müssen zwischen den Tags 3f1c4e4b6b16bbbd69b2ee476dc4f83a platziert werden. Dies hängt im Allgemeinen von der Situation ab 93f0f5c25f18dab9d176bd4f6de5d30e-Tag.
1. 3f1c4e4b6b16bbbd69b2ee476dc4f83a-Tag
Wenn Sie ein JavaScript-Skript in eine HTML-Seite einfügen müssen, verwenden Sie bitte das 3f1c4e4b6b16bbbd69b2ee476dc4f83a 3f1c4e4b6b16bbbd69b2ee476dc4f83a und 2cacc6d41bbb37262a98f745aa00fbf0 teilen JavaScript mit, wo es beginnen
und enden soll. Die Codezeile zwischen 3f1c4e4b6b16bbbd69b2ee476dc4f83a und 2cacc6d41bbb37262a98f745aa00fbf0 enthält JavaScript:
<span style="font-size:18px;"><script type="text/javascript">
alert("欢迎来到JavaScript世界！！！");
</script></span> Sie müssen den obigen Code nicht verstehen. Verstehen Sie einfach, dass Browser das JavaScript zwischen 3f1c4e4b6b16bbbd69b2ee476dc4f83a interpretieren und ausführen. Diese älteren
-Instanzen verwenden möglicherweise type="text/javascript" im 3f1c4e4b6b16bbbd69b2ee476dc4f83a Dies ist nicht mehr notwendig. JavaScript ist die Standard-Skriptsprache in allen modernen Browsern
sowie HTML5. Für diejenigen, die gerade die JavaScript-Sprache gelernt haben, können Sie sie verwenden!
2. JavaScript in 6c04bd5ca3fcae76e30b72ad730ca86d
In diesem Beispiel schreibt JavaScript Text in den 6c04bd5ca3fcae76e30b72ad730ca86d, wenn die Seite geladen wird:
Beispielcode:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JavaScript脚本语言</title>
>
</head>
<body>
<p>
JavaScript 能够直接写入 HTML 输出流中：
</p>
<script type="text/javascript">
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph.</p>");
</script>
<p>
您只能在 HTML 输出流中使用 <strong>document.write</strong>。
如果您在文档已加载后使用它（比如在函数中），会覆盖整个文档。
</p>
</body>
</html>Es ist uns egal, wie man den JavaScript-Code schreibt und ausführt, schauen wir uns zuerst die laufenden Ergebnisse an:
3 und Ereignisse
Die JavaScript-Anweisung im obigen Beispiel wird ausgeführt, wenn die Seite geladen wird. Oft müssen wir Code ausführen, wenn ein Ereignis eintritt, beispielsweise wenn der Benutzer
auf eine Schaltfläche klickt. Wenn wir den JavaScript-Code in eine Funktion einfügen, können wir diese Funktion aufrufen, wenn ein Ereignis eintritt.
4. JavaScript in 93f0f5c25f18dab9d176bd4f6de5d30e
Sie können eine unbegrenzte Anzahl von Skripten in das HTML-Dokument einfügen. Skripte können sich in den Abschnitten 6c04bd5ca3fcae76e30b72ad730ca86d oder in beiden
-Abschnitten befinden. Eine gängige Vorgehensweise besteht darin, Funktionen im Abschnitt 53495576791aca4fd1a7d5b144a1d127 einzufügen. Auf diese Weise können sie an derselben Stelle platziert werden, ohne
den Inhalt der Seite zu beeinträchtigen.
5. JavaScript-Funktion in 93f0f5c25f18dab9d176bd4f6de5d30e Diese Funktion wird aufgerufen, wenn auf die Schaltfläche geklickt wird: Beispielcode:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JavaScript脚本语言</title>
<script type="text/javascript">
function myFunction()
{
document.getElementById("demo").innerHTML="My First JavaScript Function";
}
</script>
</head>
<body>
<h1>My Web Page</h1>
<p id="demo">A Paragraph.</p>
<button type="button" onclick="myFunction()">点击这里</button>
</body>
</html>Das Ergebnis der Operation ist:
Der Effekt nach dem Klicken Die Schaltfläche lautet:
Beispielcode: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JavaScript脚本语言</title>
</head>
<body>
<h1>My First Web Page</h1>
<p id="demo">A Paragraph.</p>
<button type="button" onclick="myFunction()">点击这里</button>
<script type="text/javascript">
function myFunction()
{
document.getElementById("demo").innerHTML="My First JavaScript Function";
}
</script>
</body>
</html> Das Ergebnis der Operation ist das gleiche wie das Ergebnis der oben genannten fünf!
Wir fügen das JavaScript am Ende des Seitencodes ein, damit wir sicherstellen können, dass das Skript ausgeführt wird, nachdem das e388a4556c0f65e1904146cc1a846bee-Element erstellt wurde. 7. Externes JavaScript Wir können das Skript auch in einer externen Datei speichern. Externe Dateien enthalten häufig Code, der von mehreren Webseiten verwendet wird. Die Dateierweiterung für externe JavaScript-Dateien ist .js. Wenn Sie eine externe Datei verwenden müssen, legen Sie bitte die .js-Datei im „src“-Attribut des 3f1c4e4b6b16bbbd69b2ee476dc4f83a fest. Wenn eine große Menge JavaScript-Code vorhanden ist, empfehlen wir die Verwendung der externen JavaScript-Methode. Im Allgemeinen verwenden wir auch eine separate Möglichkeit, eine Verbindung zum HTML-Dokument herzustellen.
BeispielHTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>JavaScript脚本语言</title> <script type="text/javascript" src="/js/myScript.js"></script> </head> <body> <h1>My Web Page</h1> <p id="demo">A Paragraph.</p> <button type="button" onclick="myFunction()">点击这里</button> <p><b>注释：</b>myFunction 保存在名为 "myScript.js" 的外部文件中。</p> </body> </html>
myScript.js-Code:
function myFunction()
{
document.getElementById("demo").innerHTML="My First JavaScript Function";
}Das laufende Ergebnis stimmt mit dem oben Gesagten überein!
Tipps: Es ist möglich, Skriptdateien in Externe Skripte dürfen keine 3f1c4e4b6b16bbbd69b2ee476dc4f83a-Tags enthalten.
Das Obige ist die Methode zur Kombination von JavaScript und HTML. Ich hoffe, dass sie für das Lernen aller hilfreich sein wird. Verwandte Empfehlungen:
Der Unterschied zwischen HTML- und JavaScript-Links
Einführung, wie JavaScript und HTML5 kreisförmige Zeichenmuster auf der Leinwand implementieren
Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung der Kombination von JavaScript und HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!