Υποενότητα 6.2: Απλό αρχείο JavaScript

Πού γράφουμε JavaScript κώδικα σε HTML αρχείο;

Η JavaScript μπορεί να συνδεθεί στο αρχείο HTML χρησιμοποιώντας τρεις διαφορετικούς τρόπους:

Εισαγωγή JavaScript στο head του HTML αρχείου
Εισαγωγή JavaScript στο τέλος του body του HTML αρχείου
Χρήση εξωτερικού - external αρχείου και αναφορά του JavaScript αρχείου είτε στο head είτε στο τέλος του body του HTML αρχείου

Μέσα στο HTML αρχείο

Όταν χρησιμοποιούμε τον πρώτο ή τον δεύτερο τρόπο, πρέπει να περικλείσουμε τον κώδικα μέσα στις ετικέτες <script>.. </script>.

Γενικά, όταν γράφουμε JavaScript απευθείας στο HTML είναι προτιμότερο να τη βάλουμε στο τέλος του body και όχι στο head. Αυτό συμβαίνει επειδή θέλουμε η σελίδα μας να έχει ολοκληρώσει τη φόρτωση, ώστε να μπορεί να λειτουργήσει σωστά ηJavaScript.

<!DOCTYPE html>
<html>
  <head>
        . . . <script> load JavaScript libraries here </script>. . .
  </head>
  <body>
        . . . <script> your JavaScript code typically goes at the end of body </script>. . .
  </body>
</html>

Εξωτερικό αρχείο - External file

Όταν χρησιμοποιούμε ένα εξωτερικό αρχείο, ΔΕΝ γράφουμε ετικέτες. Γράφουμε μόνο τον κώδικα JavaScript μας. Και πάλι προτιμούμε να αναφέρουμε τη JavaScript στο τέλος του HTML body.

<!DOCTYPE html>
<html>
  <head>
        . . . <script> load JavaScript libraries here </script>. . .
  </head>
  <body>
        . . . <script type="text/javascript" src="js/myscript.js"></script>. . .
  </body>
</html>

Με τους τρεις διαθέσιμους τρόπους, ο 3ος, η χρήση ενός εξωτερικού αρχείου, είναι ο προτιμώμενος τρόπος.

Ένας λόγος για αυτό είναι επειδή, με τον τρόπο αυτό, διαχωρίζουμε την HTML σήμανση από τον JavaScript κώδικα. Επιπλέον, είναι ευκολότερο να διαβάζετε τα αρχεία και να κάνετε αλλαγές. Επίσης, βοηθάει τη φόρτωση σελίδας πιο γρήγορα.

Περισσότερες πληροφορίες: https://www.w3schools.com/js/js_whereto.asp