Heim >Web-Frontend >js-Tutorial >Beispiel für das Einfügen von JavaScript-Code in HTML_Basics

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

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOriginal: 2016-05-16 15:56:561142Durchsuche

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 93f0f5c25f18dab9d176bd4f6de5d30e...9c3bca370b5104690d9ef395f2c5f8d1
In den Abschnitten 6c04bd5ca3fcae76e30b72ad730ca86d...36cc49f0c466276486e50c850b7e4956 und 93f0f5c25f18dab9d176bd4f6de5d30e...9c3bca370b5104690d9ef395f2c5f8d1
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>

Dies führt zu folgenden Ergebnissen:

JavaScript im Abschnitt 6c04bd5ca3fcae76e30b72ad730ca86d... dbf4a1b9d12965251b02d12dd197d73e:

Wenn zum Laden der Seite ein Skript erforderlich ist, damit das Skript Seiteninhalte zur Ausführung generiert, platzieren Sie das Skript im Abschnitt 6c04bd5ca3fcae76e30b72ad730ca86d 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>

JavaScript in den Abschnitten 6c04bd5ca3fcae76e30b72ad730ca86d

Sie können JavaScript-Code genau wie folgt in die Abschnitte 93f0f5c25f18dab9d176bd4f6de5d30e 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>

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>

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:

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

Vorheriger Artikel：Besprechen Sie ausführlich die Fähigkeiten von cookie_javascript in JavascriptNächster Artikel：Besprechen Sie ausführlich die Fähigkeiten von cookie_javascript in Javascript

In Verbindung stehende Artikel

Mehr sehen