Programmation Web Avanc´e e JQuery
Thierry Hamon
Bureau H202 - Institut Galil´e e T´l. : 33 1.48.38.35.53 e Bureau 150 – LIM&BIO – EA 3969 Universit´ Paris 13 - UFR L´onard de Vinci e e 74, rue Marcel Cachin, F-93017 Bobigny cedex T´l. : 33 1.48.38.73.07, Fax. : 33 1.48.38.73.55 e thierry.hamon@univ-paris13.fr http://http://www-limbio.smbh.univ-paris13.fr/membres/hamon/

1/27

Introduction
Biblioth`que Javascript e
D´velopp´e par John Resig e e http://jquery.com/

Utilisation plus facile des fonctionnalit´s Javascript e Encapsulation de code Javascript pour en ´crire moins e Compatible avec la plupart des navigateurs Exemple : JQuery g`re les particularit´s de chaque navigateur e e Possibilit´ d’extensions ` l’aide de plugins e a

2/27

Exemples de sites Web
Google Code (http://code.google.com/intl/fr/) Amazon (http://www.amazon.com/) IBM (http://www.ibm.com/us/en/) Dell (http://www.dell.com/ Microsoft (http://www.microsoft.com/en-us/default.aspx) NBC (http://www.nbc.com/) EDF (www.edf.fr) Minist`re de la Recherche e (http://www.recherche.gouv.fr/) ...

3/27

Introduction
Objectifs : S’abtraire des sp´cificit´s des navigateurs e e Eviter les manipulations r´barbatives et r´p´titives en e e e Javascript Simplifier l’´criture du code et de certaines fonctionnalit´s e e (gestion des menus, AJAX, animations, etc.)
// D ´ f i l e m e n t v e r t i c a l d ’ un d i v e $(” . content ” ) . slideUp ( ) ; $ ( ” . content ” ) . slideDown ( ) ;

Contrainte : Javascript doit ˆtre activ´ e e

4/27

Utilisation
Inclusion de la librairie : D´veloppement : e http://code.jquery.com/jquery-1.6.4.js Production (version miniale) : http://code.jquery.com/jquery-1.6.4.min.js // Code JQuery // Code JQuery

5/27

Principe de fonctionnement
D´finition d’une fonction : jquery() ou $() (raccourci) e Remarques :
Accepte des param`tres (en g´n´ral, un s´mecteur) e e e e Retourne un objet JQuery Est ex´cut´e au cours du chargement de l’arbre DOM de la