Χρήση JavaScript

<script> tag

In HTML, JavaScript code must be placed within <script> with </script> between tags.

Παράδειγμα

<script>
document.getElementById("demo").innerHTML = "my first JavaScript section";
</script>

δοκιμάσετε προσωπικά

Σημείωση:旧的 JavaScript 例子也许会使用 Παλαιές παραδείγματα JavaScript μπορεί να χρησιμοποιούν Type

Σημείωση:Ιδιότητα:<script type="text/javascript">.

Η ιδιότητα του type δεν είναι απαραίτητη. Το JavaScript είναι το προεπιλεγμένο γλωσσικό σώμα στο HTML.

JavaScript και γεγονότα JavaScriptΣυνάρτηση

Είναι ένα βρόχο κώδικα JavaScript που μπορεί να εκτελεστεί όταν καλείται.Για παράδειγμα, όταν συμβείΓεγονός

Σημείωση:Καλείτε τη συνάρτηση όταν συμβεί γεγονός, όπως όταν ο χρήστης κάνει κλικ σε ένα κουμπί.

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

<head> ή <body> του JavaScript

Μπορείτε να τοποθετήσετε οποιοδήποτε αριθμό κώδικα σε ένα έγγραφο HTML. <body> ή <head> Το κείμενο μπορεί να τοποθετηθεί στο HTML της ιστοσελίδας

Το JavaScript στο

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

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

Παράδειγμα

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "Ο παράγραφος άλλαξε.";
}
</script>
</head>
<body>
<h1>Μια Ιστοσελίδα</h1>
<p id="demo">Ένας παράγραφος</p>
<button type="button" onclick="myFunction()">Δοκιμάστε</button>
</body>
</html>

δοκιμάσετε προσωπικά

<body> του HTML

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

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

Παράδειγμα

<!DOCTYPE html>
<html>
<body> 
<h1>Μια Σελίδα Διαδικτύου</h1>
<p id="demo">Ένας παράγραφος</p>
<button type="button" onclick="myFunction()">Δοκιμάστε</button>
<script>
function myFunction() {
   document.getElementById("demo").innerHTML = "Ο παράγραφος άλλαξε.";
}
</script>
</body>
</html>

δοκιμάσετε προσωπικά

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

Εξωτερικοί κώδικες

Ο κώδικας μπορεί να τοποθετηθεί στο εξωτερικό αρχείο:

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

function myFunction() {
   document.getElementById("demo").innerHTML = "Ο παράγραφος άλλαξε.";
}

Οι εξωτερικοί κώδικες είναι πολύ χρήσιμοι, αν ο ίδιος κώδικας χρησιμοποιείται σε πολλές διαφορετικές ιστοσελίδες.

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

Για να χρησιμοποιήσετε εξωτερικούς κώδικες, παρακαλώ <script> ετικέτη src (πηγή) για να ρυθμίσετε το όνομα του κώδικα στο

Παράδειγμα

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

δοκιμάσετε προσωπικά

Μπορείτε να τοποθετήσετε <head> ή <body> τοποθετείται εξωτερικός κώδικας αναφοράς.

Η απόδοση του κώδικα αυτού είναι ανάλογη με το πού τον τοποθετήσατε <script> Τα ετικέτες είναι τα ίδια.

Σημείωση:Εξωτερικοί κώδικες δεν μπορούν να περιέχουν <script> ετικέτες.

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

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

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

Για να προσθέσετε πολλαπλά αρχεία σεναρίων σε μια σελίδα - χρησιμοποιήστε πολλαπλά script ετικέτες:

Παράδειγμα

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

Εξωτερική αναφορά

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

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

Παράδειγμα

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

δοκιμάσετε προσωπικά

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

Παράδειγμα

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

δοκιμάσετε προσωπικά

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

Παράδειγμα

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

δοκιμάσετε προσωπικά

Μπορείτε να HTML διαδρομή αρχείουΜάθετε περισσότερα για τις διαδρομές αρχείων.