Beispiel für das Einfügen von JavaScript-Code in HTML

Beispiel für das Einfügen von JavaScript-Code in HTML_Basics

WBOY

Freigeben： 2016-05-16 15:56:56

Original

1106 Leute haben es durchsucht

JavaScript-Code kann überall in einem HTML-Dokument eingefügt werden. Es gibt jedoch die folgenden besten Möglichkeiten, JavaScript in HTML-Dateien einzubinden.

Im Abschnitt ...
In den Abschnitten ... und ...

In den folgenden Abschnitten werden wir sehen, wie JavaScript unterschiedlich eingebunden werden kann:

Wenn Sie ein Skript bei einem Ereignis ausführen möchten, wenn der Benutzer beispielsweise irgendwo klickt, sollte der Kopf des Skripts so aussehen:

<html>
<head>
<script type="text/javascript">
<!--
function sayHello() {
  alert("Hello World")
}
//-->
</script>
</head>
<body>
<input type="button" onclick="sayHello()" value="Say Hello" />
</body>
</html>

Nach dem Login kopieren

Dies führt zu folgenden Ergebnissen:

JavaScript im Abschnitt ... :

Wenn zum Laden der Seite ein Skript erforderlich ist, damit das Skript Seiteninhalte zur Ausführung generiert, platzieren Sie das Skript im Abschnitt In diesem Fall ist es nicht notwendig, alle von JavaScript definierten Funktionen zu nutzen:

<html>
<head>
</head>
<body>
<script type="text/javascript">
<!--
document.write("Hello World")
//-->
</script>
<p>This is web page body </p>
</body>
</html>

Nach dem Login kopieren

JavaScript in den Abschnitten

Sie können JavaScript-Code genau wie folgt in die Abschnitte einfügen:

In der externen JavaScript-Datei:

<html>
<head>
<script type="text/javascript">
<!--
function sayHello() {
  alert("Hello World")
}
//-->
</script>
</head>
<body>
<script type="text/javascript">
<!--
document.write("Hello World")
//-->
</script>
<input type="button" onclick="sayHello()" value="Say Hello" />
</body>
</html>

Nach dem Login kopieren

Wenn Sie intensiver mit JavaScript arbeiten, werden Sie möglicherweise feststellen, dass es Situationen gibt, in denen Sie denselben JavaScript-Code auf mehreren Seiten Ihrer Website wiederverwenden.

Sie sind nicht darauf beschränkt, denselben Code in mehreren HTML-Dateien beizubehalten. Das Skript-Tag bietet einen Mechanismus, der es ermöglicht, JavaScript in einer externen Datei zu speichern und dann in eine HTML-Datei einzubinden.

Hier ist ein Beispiel, um zu veranschaulichen, wie Skript-Tags und das src-Attribut verwendet werden, um eine externe JavaScript-Datei in HTML-Code einzubinden:

Um JavaScript aus einer externen Dateiquelle zu verwenden, müssen Sie den gesamten JavaScript-Code mit einer Erweiterung in eine einfache Textdatei „.js“ schreiben und die Datei dann wie oben gezeigt einbinden.

<html>
<head>
<script type="text/javascript" src="filename.js" ></script>
</head>
<body>
.......
</body>
</html>

Nach dem Login kopieren

Zum Beispiel können Sie den Inhalt von filename.js in der folgenden Datei behalten und dann die Funktion sayHello in der HTML-Datei verwenden, nachdem Sie die Datei filename.js eingefügt haben: