JavaScript Code in HTML einbinden

Über das <script> HTML Element:

Code direkt in die HTML Datei mit einfügen

bezieht sich nur auf die Seite in der es eingebunden ist
nicht für seitenübergreifenden Code geeignet
wird meist im head verwendet
sollte nur im Ausnahmefall verwendet werden

HTML<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="utf-8" />
    <title>Titel der Seite</title>
    <script>
      console.log('Hallo');
    </script>
  </head>
  <body>
    <p>Text</p>
  </body>
</html>

Im head Element, zentrale JS Datei/en für einzelne Seite laden
- src Attribut mit Pfad zur externen JS Datei
- kann in jeder Seite eingebunden werden
- aller Code zentral verwaltet
- übliche Vorgehensweise
- wird meist im head eingebunden (möglichst schnell anfangen zu laden)
- Scripte laden parallel zum Seitenaufbau mit einem der beiden booleschen Attribute
  - async: führt das Script aus, sobald es geladen wurde
  - defer: führt das Script aus, nachdem die Seite aufgebaut wurde (stellt Zugriff auf DOM Elemente im Script sicher)^{ⓘAlternativ kann ein onLoad Event im Script verwendet werden (siehe Kapitel über Events).↩}
```
HTML<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="utf-8" />
    <title>Titel der Seite</title>
    <base href="https://uhahne.github.io/GIS/" />
    <link rel="stylesheet" href="styles.css" />
    <script src="script.js" defer></script>
  </head>
  <body>
    <p>Text</p>
  </body>
</html>
```