jQuery est une bibliothèque JavaScript très populaire qui permet aux développeurs web de créer des sites web dynamiques et interactifs. Une des fonctionnalités les plus utiles de jQuery est la possibilité de manipuler le Document Object Model (DOM) pour créer des effets visuels et des interactions avec les utilisateurs. Dans cet article, nous allons examiner comment utiliser jQuery pour créer une boîte de message déclenchée par un clic sur un bouton. Nous verrons comment ajouter des éléments HTML à la page, comment définir des styles CSS et comment déclencher des événements lorsque le bouton est cliqué.
jQuery : DOM : Boite message déclenchée sur clic bouton.
Ce que l’on va faire ici
- Dans ce code jQuery intégré dans une page HTML, un clic bouton déclenche une boîte d’alerte.
Le code HTML + jQuery
<!– Debut de la page HTML –>
<html>
<!– Debut entete –>
<head>
<meta charset=« utf-8 » /> <!– Encodage de la page –>
<title>Titre</title> <!– Titre de la page –>
<script src=« http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js »></script>
<!– Début du code Javascript –>
<script language=« javascript » type=« text/javascript »>
<!–
$(« #myButton »).click(function(){
alert(« Clic bouton »);
});
});
</script>
<!– Fin du code Javascript –>
</head>
<!– Fin entete –>
<!– Debut Corps de page HTML –>
<body >
<button id=« myButton »>Click me !</button>
</body>
<!– Fin de corps de page HTML –>
</html>
<!– Fin de la page HTML –>
