Introduction à JavaScript
Qu'est-ce que JavaScript ?
JavaScript est un langage de programmation
interprété principalement utilisé pour créer des
pages web interactives. Il est l'un des piliers du
développement web moderne, aux côtés de HTML et
CSS.
#### Origine et rôle de JavaScript
JavaScript a été créé en 1995 par Brendan Eich,
alors qu'il travaillait chez Netscape
Communications. Son but initial était d'ajouter des
comportements dynamiques aux pages web
statiques. Aujourd'hui, JavaScript est indispensable
pour le développement de sites et d'applications
web, permettant de créer des expériences
utilisateur enrichissantes et interactives.
#### Comparaison avec HTML et CSS
Pour mieux comprendre le rôle de JavaScript, il est
important de le comparer avec HTML et CSS :
- **HTML (HyperText Markup Language)** est utilisé
pour structurer le contenu d'une page web. Par
exemple, il définit où se trouvent les titres, les
paragraphes, les images, etc.
- **CSS (Cascading Style Sheets)** est utilisé pour
styliser une page web, contrôlant son apparence
visuelle comme les couleurs, les polices, les marges,
etc.
- **JavaScript**, quant à lui, est utilisé pour rendre la
page web interactive. Il permet d'ajouter des
animations, de manipuler le DOM (Document Object
Model) pour modifier le contenu et l'apparence en
temps réel, et de gérer les événements utilisateur
comme les clics et les formulaires soumis.
#### Exemples simples de code
JavaScript
Pour illustrer ses fonctionnalités de base, voici
quelques exemples de code JavaScript :
1. **Afficher un message dans la console** :
```javascript
console.log('Bonjour, monde !');
```
Ce code affiche le texte "Bonjour, monde !" dans la
console du navigateur.
2. **Changer le contenu d'un élément HTML** :
```html
<!DOCTYPE html>
<html>
<head>
<title>Exemple JavaScript</title>
<script>
function changerContenu() {
document.getElementById('demo').innerHTML =
'Contenu changé !';
}
</script>
</head>
<body>
<p id="demo">Ceci est un paragraphe.</p>
<button onclick="changerContenu()">Cliquez
ici</button>
</body>
</html>
```
Ce code change le texte du paragraphe avec l'ID
"demo" en "Contenu changé !" lorsque l'utilisateur
clique sur le bouton.
3. **Validation d'un formulaire** :
```html
<!DOCTYPE html>
<html>
<head>
<title>Validation de formulaire</title>
<script>
function validerFormulaire() {
var nom = document.getElementById('nom').value;
if (nom == '') {
alert('Veuillez entrer votre nom.');
return false;
}
return true;
}
</script>
</head>
<body>
<form onsubmit="return validerFormulaire()">
Nom: <input type="text" id="nom">
<input type="submit" value="Soumettre">
</form>
</body>
</html>
```
Ce code vérifie que l'utilisateur a entré un nom avant
de soumettre le formulaire. Si le champ est vide, un
message d'alerte s'affiche.
### Conclusion
JavaScript joue un rôle crucial
dans le développement web
moderne en permettant de créer
des pages interactives et
dynamiques. Comparé à HTML et
CSS, JavaScript offre des
fonctionnalités pour manipuler le
contenu et répondre aux
interactions des utilisateurs en
temps réel. Ces exemples simples
montrent comment JavaScript
peut être utilisé pour enrichir
l'expérience utilisateur sur une
page web.
J'espère que cette introduction
vous a aidé à mieux comprendre
😊
JavaScript et son importance !