Wo befindet sich der Javascript-Code

Der Javascript-Code kann sich im <head>-Bereich des HTML-Dokument befinden.

				
					 <!DOCTYPE html>
<html>
<head>
<script>
function js_in_head() {
  document.getElementById("demo").innerHTML = "Dieser Javascript-Code befindet sich im head-Bereich!!!";
}
</script>
</head>
<body>

<h4>Javascript im head-Bereich</h4>

<p id="demo">Wo befindet sich dieser Javascript-Code?</p>
<button class="myButton" type="button" onclick="js_in_head()">Klick!!!</button>

</body>
</html>

Javascript im head-Bereich

Wo befindet sich dieser Javascript-Code?

Der Javascript-Code kann sich auch im <body>-Bereich des HTML-Dokument befinden.

				
					 <!DOCTYPE html>
<html>
<head>
</head>
<body>
<h4>Javascript im body-Bereich</h4>

<p id="demo_1">Wo befindet sich dieser Javascript-Code?</p>
<button class="myButton" type="button" onclick="js_in_body()">Klick!!!</button>

<script>
function js_in_body() {
  document.getElementById("demo_1").innerHTML = "Dieser Javascript-Code befindet sich im body-Bereich!!!";
}
</script>

</body>
</html>

Javascript im body-Bereich

Wo befindet sich dieser Javascript-Code?

Der Javascript-Code kann sich in einem externen (ausgelagerten) Datei befinden. Hier wird im head-Bereich mit dem script-Tag und dem Attribut src (source) auf die externe Datei 1.js verwiesen.

				
					 <!DOCTYPE html>
<html>
<head>
<script src="1.js"></script>
</head>
<body>

<h4>Javascript in externer Datei</h4>

<p id="demo_2">Wo befindet sich dieser Javascript-Code?</p>
<button class="myButton" type="button" onclick="external_file_js()">Klick!!!</button>

</body>
</html>

Javascript in externer Datei

Wo befindet sich dieser Javascript-Code?

Die 1.js befindet sich in der Ordnerstruktur auf der gleichen Ebene wie das HTML-Dokument. Die externe Datei 1.js sieht wie folgt aus.

				
					function external_file_js() {
  document.getElementById("demo_2").innerHTML = "Ich werde angezeigt aus einer externer JS-Datei.";
}