JavaScript peut être placé dans le <body> et <head> sections d'une page HTML.
Le <script> Tag
En HTML, le code JavaScript doit être inséré entre <script> et </script> tags.
Exemple
<script>
document.getElementById("demo").innerHTML = "My First JavaScript";
</script>
Des exemples plus anciens peuvent utiliser un attribut de type: <script type="text/javascript"> .
Cet attribut de type est pas nécessaire. JavaScript est le langage de script par défaut en HTML.
Fonctions et événements JavaScript
Une JavaScript function est un bloc de code JavaScript, qui peut être exécutée lorsque " a demandé" pour.
Par exemple, une fonction peut être exécutée quand unévénement se produit, comme lorsque l'utilisateur clique sur un bouton.
Vous apprendrez beaucoup plus sur les fonctions et les événements dans les chapitres suivants.
JavaScript <head> ou <body>
Vous pouvez placer un certain nombre de scripts dans un document HTML.
Les scripts peuvent être placés dans le <body> , ou dans le <head> section d'une page HTML, ou dans les deux.
Garder tout le code en un seul endroit, est toujours une bonne habitude.
JavaScript <head>
Dans cet exemple, une fonction JavaScript est placé dans le <head> section d'une page HTML.
La fonction est invoquée (appelé) quand un bouton est cliqué:
Exemple
<!DOCTYPE html>
<html><head>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</head>
<body>
<h1>My Web Page</h1>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try
it</button>
</body>
</html>
Essayez - le vous - même » JavaScript <body>
Dans cet exemple, une fonction JavaScript est placé dans le <body> section d'une page HTML.
La fonction est invoquée (appelé) quand un bouton est cliqué:
Exemple
<!DOCTYPE html>
<html>
<body>
<h1>My 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>
Essayez - le vous - même » Il est une bonne idée de placer des scripts au bas de la <body> élément.
Cela peut améliorer la page de chargement, car le script de compilation peut ralentir l'affichage.
JavaScript externe
Les scripts peuvent également être placés dans des fichiers externes:
MyScript.js
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
scripts externes sont pratiques lorsque le même code est utilisé dans de nombreuses pages web différentes.
Fichiers JavaScript ont l'extension de fichier .js .
Pour utiliser un script externe, mettre le nom du fichier de script dans l'attribut src (source) d'un <script> tag:
Exemple
<!DOCTYPE html>
<html>
<body>
<script src="myScript.js"></script>
</body>
</html> Essayez - le vous - même » Vous pouvez placer une référence de script externe dans <head> ou <body> que vous le souhaitez.
Le script se comporte comme si elle était située exactement où le <script> tag est situé.
Scripts externes ne peuvent pas contenir <script> tags.
JavaScript externe Avantages
Placer JavaScripts dans des fichiers externes présente certains avantages:
- Il sépare le code HTML et
- Il rend HTML et JavaScript plus facile à lire et à maintenir
- fichiers JavaScript Cached peuvent accélérer chargement de la page