03. Πού γράφεται η Javascript

JS Where To


Η ετικέτα (tag) < script >

Στην HTML, ο JavaScript κώδικας πρέπει να τοποθετηθεί ανάμεσα σε ετικέτες <script> και </script>.

Παράδειγμα

<script>
document.getElementById("demo").innerHTML = "My First JavaScript";
</script>

Δοκιμάστε το »

Τα παλιά παραδείγματα JavaScript ενδέχεται να χρησιμοποιούν ένα χαρακτηριστικό τύπου: <script type = “text / javascript”>.
Το χαρακτηριστικό τύπου δεν απαιτείται. Η JavaScript είναι η προεπιλεγμένη γλώσσα δέσμης ενεργειών σε HTML.


Συναρτήσεις (functions) και γεγονότα (events) JavaScript

Μια JavaScript functionείναι ένα μπλοκ κώδικα JavaScript, που μπορεί να εκτελεστεί όταν “καλείται”.

Για παράδειγμα, μια συνάρτηση μπορεί να καλείται όταν γίνεται ένα γεγονός (event), όπως όταν ο χρήστης κάνει κλικ σε ένα κουμπί.

Θα μάθετε περισσότερα για τις συναρτήσεις και τα γεγονότα σε επόμενα κεφάλαια.


JavaScript σε < head > ή < body >

Μπορείτε να τοποθετήσετε οποιοδήποτε αριθμό σεναρίων (δέσμες ενεργειών – scripts) σε ένα έγγραφο HTML.

Τα σενάρια μπορούν να τοποθετηθούν στην <body>, ή στην <head>ενότητα μιας σελίδας HTML, ή και στα δύο.


Η JavaScript στο < head >

Σε αυτό το παράδειγμα, μια JavaScript function τοποθετείται στην <head> ενότητα μιας σελίδας HTML.

Η συνάρτηση ενεργοποιείται (καλείται) όταν πατηθεί ένα κουμπί:

Παράδειγμα

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
  document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</head>
<body>

<h1>A Web Page</h1>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try it</button>

</body>
</html>

Δοκιμάστε το »


Η JavaScript στο < body >

Σε αυτό το παράδειγμα, μια JavaScript function τοποθετείται στην <body> ενότητα μιας σελίδας HTML.

Η function ενεργοποιείται (καλείται) όταν πατηθεί ένα κουμπί:

Παράδειγμα

<!DOCTYPE html>
<html>
<body>

<h1>A Web Page</h1>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try it</button>

<script>
function myFunction() {
 document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>

</body>
</html>

Δοκιμάστε το »

Η τοποθέτηση σεναρίων (scripts) στο κάτω μέρος του στοιχείου <body> βελτιώνει την ταχύτητα εμφάνισης, επειδή η εκτέλεση του σεναρίου επιβραδύνει την εμφάνιση.


Εξωτερική JavaScript

Τα scripts μπορούν επίσης να τοποθετηθούν σε εξωτερικά αρχεία:

Εξωτερικό αρχείο: myScript.js

function myFunction() {
 document.getElementById("demo").innerHTML = "Paragraph changed.";
}

Τα εξωτερικά σενάρια είναι πρακτικά όταν ο ίδιος κώδικας χρησιμοποιείται σε πολλές διαφορετικές ιστοσελίδες.

Τα αρχεία JavaScript έχουν την επέκταση αρχείου .js .

Για να χρησιμοποιήσετε ένα εξωτερικό script, τοποθετήστε το όνομα του αρχείου JavaScript στο χαρακτηριστικό src (source) μιας <script> ετικέτας:

Παράδειγμα

<script src="myScript.js"></script>

Δοκιμάστε τον εαυτό σας »

Μπορείτε να τοποθετήσετε μια εξωτερική αναφορά σεναρίου στο <head>ή <body> αν θέλετε.

Το σενάριο θα συμπεριφέρεται σαν να βρισκόταν ακριβώς εκεί που βρίσκεται η <script>ετικέτα.

Τα εξωτερικά σενάρια δεν μπορούν να περιέχουν <script>ετικέτες.


Πλεονεκτήματα της εξωτερικής JavaScript

Η τοποθέτηση σεναρίων σε εξωτερικά αρχεία έχει ορισμένα πλεονεκτήματα:

  • Διαχωρίζει την HTML και τον κώδικα
  • Κάνει την HTML και τη JavaScript πιο εύκολη στην ανάγνωση και συντήρηση
  • Τα αποθηκευμένα στη κρυφή μνήμη (cashed) αρχεία JavaScript μπορούν να επιταχύνουν τα φορτία της σελίδας

Για να προσθέσετε πολλά σενάρια σε μια σελίδα – χρησιμοποιήστε διάφορες ετικέτες δέσμης ενεργειών:

Παράδειγμα

<script src="myScript1.js"></script>
<script src="myScript2.js"></script>

Εξωτερικές αναφορές

Τα εξωτερικά σενάρια μπορούν να αναφέρονται με μια πλήρη διεύθυνση URL ή με μια διαδρομή σχετική με την τρέχουσα ιστοσελίδα.

Αυτό το παράδειγμα χρησιμοποιεί μια πλήρη διεύθυνση URL για τη σύνδεση σε ένα σενάριο:

Παράδειγμα

<script src="https://www.w3schools.com/js/myScript1.js"></script>

Δοκιμάστε τον εαυτό σας »

Αυτό το παράδειγμα χρησιμοποιεί ένα σενάριο που βρίσκεται σε έναν καθορισμένο φάκελο στον τρέχοντα ιστότοπο:

Παράδειγμα

<script src="/js/myScript1.js"></script>

Δοκιμάστε τον εαυτό σας »

Αυτό το παράδειγμα συνδέεται με ένα JavaScript αρχείο που βρίσκεται στον ίδιο φάκελο με την τρέχουσα σελίδα:

Παράδειγμα

<script src="myScript1.js"></script>

Δοκιμάστε τον εαυτό σας »

Μπορείτε να διαβάσετε περισσότερα σχετικά με τις διαδρομές αρχείων στο κεφάλαιο HTML Διαδρομές αρχείων .

Days
Hours
Minutes

03. Πού γράφεται η Javascript

Κοινοποίηση

Share on facebook
Share on twitter

Ακολουθήστε μας

Αρέσει σε %d bloggers: