1. Ερώτηση Πρακτικής Άσκησης με Απάντηση Βήμα-Βήμα

Ερώτηση: Δημιουργήστε ένα αρχείο HTML, στο οποίο θα περιλαμβάνετε ένα εξωτερικό αρχείο JavaScript με όνομα "Seminaria Javascript.js".

  • Βεβαιωθείτε ότι το αρχείο JavaScript βρίσκεται στον ίδιο φάκελο με το αρχείο HTML.

Απάντηση:

<!DOCTYPE html>

<html>

 <head>

<meta charset='utf-8'>

<title> Πρότυπο HTML</title>

<script type="text/javascript" src="Seminaria Javascript.js">

</script>

 </head>

 <body>

 </body>

</html>

Προτεινόμενη Λύση ( Απάντηση ) στον code editor:



Αναλυτική Επεξήγηση

  • Δήλωση Τύπου Εγγράφου (DOCTYPE) και Βασική Δομή
    • Το <!DOCTYPE html> υποδεικνύει ότι το αρχείο είναι σε HTML5, την πιο πρόσφατη έκδοση της HTML.
    • Η δομή του εγγράφου περιλαμβάνει τα <html>, <head>, και <body>.
  • Ρύθμιση Κωδικοποίησης (charset)
    • Το <meta charset="utf-8"> διασφαλίζει ότι το έγγραφο υποστηρίζει σωστά τους ελληνικούς χαρακτήρες (και οποιουσδήποτε άλλους Unicode χαρακτήρες).
  • Ενσωμάτωση Εξωτερικού Αρχείου JavaScript
    • Με την ιδιότητα src στο <script> καθορίζουμε τη διαδρομή του εξωτερικού αρχείου. Εφόσον το αρχείο "Seminaria Javascript.js" βρίσκεται στον ίδιο φάκελο, αρκεί να γράψουμε το όνομά του.
    • Το type="text/javascript" είναι προαιρετικό στις σύγχρονες εκδόσεις HTML5, αλλά παραμένει έγκυρο και σαφές.
  • Γιατί Χρησιμοποιούμε Εξωτερικό Αρχείο JavaScript;
    • Αυξάνει την αναγνωσιμότητα και τη συντηρησιμότητα του κώδικα, αφού ο κώδικας JavaScript βρίσκεται συγκεντρωμένος σε ένα ξεχωριστό αρχείο.
    • Μπορούμε να επαναχρησιμοποιήσουμε το ίδιο αρχείο JavaScript σε πολλές σελίδες, διατηρώντας έτσι τον κώδικα συντονισμένο και εύκολο στην αναβάθμιση.
  • Συμβουλές και Καλές Πρακτικές
    • Βεβαιωθείτε ότι το όνομα του εξωτερικού αρχείου είναι ακριβώς το ίδιο με αυτό που δηλώνετε στο src (προσέξτε κεφαλαία, πεζά, κενά κ.λπ.).
    • Μπορείτε να τοποθετήσετε το <script> στο τέλος του <body> αντί για το <head> εάν θέλετε να βεβαιωθείτε ότι το DOM έχει φορτωθεί πριν εκτελεστεί το JavaScript σας.

Με την παραπάνω λύση, το αρχείο HTML θα φορτώνει αυτόματα και θα εκτελεί το περιεχόμενο του "Seminaria Javascript.js" κάθε φορά που ανοίγετε ή ανανεώνετε τη σελίδα.

Video Απάντηση: Δείτε την παρακάτω video απάντηση για την ερώτηση.

Επόμενο μάθημα / άσκηση  
Question Box: Απαντήσεις στα ερωτήματά σας.

0 Ερωτήματα