Exemple : Hello World
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Hello World</title> </head> <body> <p id="hw"></p> <noscript>Le navigateur n'est pas configuré pour exécuter le JavaScript !</noscript> <script type="text/javascript"> document.getElementById("hw").innerHTML="Hello World"; </script> </body> </html>
Exemple 1 : on compte les clics sur un bouton !
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Compteur de clics</title> </head> <body> <button onclick="var compteur = 0; compteur = compteur + 1; console.log(compteur);">Cliquez-moi</button> </body> </html>
Exemple 2 : le compteur de l'exemple précédent est placé dans une fonction.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Compteur de clics</title> </head> <body> Compteur : <span id="resultat">0</span> <br> <button onclick="compteur()">Cliquez-moi</button> </body> <script type="text/javascript"> var cmpt = 0; function compteur() { cmpt += 1; document.getElementById("resultat").innerHTML = cmpt; } </script> </html>
Exemple : la fonction compteur est placée dans un fichier script.js
var cmpt = 0; function compteur() { cmpt = cmpt + 1; document.getElementById("resultat").innerHTML = cmpt; }
Cette fonction est intégrée au code HTML avec l'attribut src de la balise <script>.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Compteur de clics</title> </head> <body> Compteur : <span id="resultat">0</span> <br> <button onclick="compteur()">Cliquez-moi</button> </body> <script type="text/javascript" src="scripts/script.js"></script> </html>