0% ont trouvé ce document utile (0 vote)
2 vues5 pages

Guide jQuery : Manipulation et Événements

Transféré par

Mohamed
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats DOCX, PDF, TXT ou lisez en ligne sur Scribd
0% ont trouvé ce document utile (0 vote)
2 vues5 pages

Guide jQuery : Manipulation et Événements

Transféré par

Mohamed
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats DOCX, PDF, TXT ou lisez en ligne sur Scribd

📘 jQuery – Documentation technique

1️⃣ Présentation générale

jQuery est une bibliothèque JavaScript rapide et légère qui simplifie :

 La manipulation du DOM

 La gestion des événements

 Les appels AJAX

 Les animations

 La compatibilité multi-navigateurs

👉 Objectif principal : écrire moins de code JavaScript, plus lisible et plus


fiable.

2️⃣ Installation & intégration

📌 Via CDN (recommandé)

<script src="[Link]
📌 En local

<script src="/js/[Link]"></script>

3️⃣ Structure de base

Document Ready

$(document).ready(function () {

[Link]("jQuery est prêt");

});

Version courte :

$(function () {

[Link]("DOM chargé");

});

4️⃣ Sélecteurs jQuery


Sélecte
Exemple
ur

ID $("#myId")

Classe $(".myClass")

Balise $("div")

$
Attribut ("[type='text'
]")

Enfant $("ul li")

5️⃣ Manipulation du DOM

Modifier le contenu

$("#title").text("Nouveau titre");

$("#content").html("<b>Texte HTML</b>");

Modifier le style

$("#box").css("color", "red");

$("#box").addClass("active");

Attributs

$("img").attr("src", "[Link]");

$("input").val("Mohamed");
6️⃣ Gestion des événements

$("#btn").click(function () {

alert("Bouton cliqué");

});

Autres événements courants :

 click

 submit

 change

 keyup

 mouseover

Exemple formulaire :

$("#form").submit(function (e) {

[Link]();

alert("Formulaire envoyé");

});

Vous aimerez peut-être aussi