Image de l'article h30. Introduction au HTML : structure de base, balises et attributs : événements en JavaScript

16h30. Introduction au HTML : structure de base, balises et attributs : événements en JavaScript

Introduction au HTML : structure de base, balises et attributs : événements en JavaScript

Introduction au HTML

HTML, ou Hyper Text Markup Language, est le langage de balisage standard pour la création de pages Web et d'applications. Avec CSS et JavaScript, HTML est une technologie essentielle utilisée par les développeurs Web. HTML fournit la structure d'une page Web, CSS le style visuel et JavaScript l'interactivité.

Structure de base du HTML

Un document HTML est composé de deux éléments principaux : la « tête » et le « corps ». L'« en-tête » contient des informations sur le document, notamment le titre qui apparaît dans la barre de titre du navigateur et des liens vers des fichiers CSS et JavaScript. Le « corps » contient le contenu réel de la page, tel que du texte, des images, des vidéos, des liens, des listes, des tableaux et des formulaires.

Voici la structure de base d'un document HTML :

<!DOCTYPE html>
<html>
<head>
<title>Titre de la page</title>
≪/head>
<body>
Contenu de la page
</body>
</html>

Balises et attributs HTML

Les balises HTML sont utilisées pour créer des éléments HTML. Une balise est composée d'un nom de balise (tel que « p » pour le paragraphe, « h1 » pour le titre de premier niveau, « img » pour l'image), entouré de crochets. La plupart des balises ont une balise d'ouverture et une balise de fermeture, avec le contenu de l'élément entre les deux.

Voici un exemple d'élément de paragraphe :

<p>Ceci est un paragraphe.</p>

Les attributs HTML sont utilisés pour fournir des informations supplémentaires sur un élément. Ils sont placés dans la balise d'ouverture de l'élément et sont composés d'un nom d'attribut et d'une valeur d'attribut. La valeur de l'attribut est toujours placée entre guillemets.

Voici un exemple d'élément image avec les attributs 'src' (qui spécifie l'URL de l'image) et 'alt' (qui fournit un texte alternatif pour l'image) :

<img src="imagem.jpg" alt="Une belle image">

Événements en JavaScript

JavaScript est un langage de programmation qui permet d'ajouter de l'interactivité à une page Web. Une façon de procéder consiste à utiliser des événements JavaScript.

Un événement est quelque chose qui se produit dans le navigateur, comme un clic de souris, une pression sur une touche, le chargement d'une page ou un intervalle de temps écoulé. JavaScript peut répondre à ces événements et exécuter du code lorsqu'ils se produisent.

Pour que JavaScript réponde à un événement, vous devez d'abord identifier l'élément HTML auquel vous souhaitez que l'événement se produise (comme un bouton), puis vous devez spécifier l'événement auquel vous souhaitez que JavaScript réponde (comme comme un clic de souris). Cela se fait à l'aide d'un gestionnaire d'événements.

Voici un exemple illustrant comment faire en sorte que JavaScript réponde à un clic de souris sur un bouton :

<button onclick="alert('Vous avez cliqué sur le bouton !')">Cliquez sur moi !</button>

Dans cet exemple, le gestionnaire d'événements 'onclick' est utilisé pour spécifier que JavaScript doit répondre à un clic de souris. Le code JavaScript à exécuter lorsque l'événement se produit est placé entre guillemets après le nom de l'événement. Dans ce cas, le code JavaScript affiche simplement une boîte d'alerte avec le message "Vous avez cliqué sur le bouton !".

Les événements JavaScript constituent un élément essentiel de la création de pages Web interactives. Ils vous permettent de créer des pages qui répondent aux actions des utilisateurs et offrent une expérience utilisateur plus dynamique et engageante.

Répondez maintenant à l’exercice sur le contenu :

Quel est le rôle du langage HTML dans la création de pages web et d'applications ?

Tu as raison! Félicitations, passez maintenant à la page suivante

Vous avez raté! Essayer à nouveau.

Image de l'article Introduction au HTML : structure de base, balises et attributs : AJAX et API Fetch

Page suivante de lebook gratuit :

35Introduction au HTML : structure de base, balises et attributs : AJAX et API Fetch

0 minutes

Obtenez votre certificat pour ce cours gratuitement ! en téléchargeant lapplication Cursa et en lisant lebook qui sy trouve. Disponible sur Google Play ou App Store !

Get it on Google Play Get it on App Store

+ 6,5 millions
d'étudiants

Certificat gratuit et
valide avec QR Code

48 mille exercices
gratuits

Note de 4,8/5 dans les
magasins d'applications

Cours gratuits en
vidéo, audio et texte