Developpez en Ajax : Avec quinze exemples de composants reutilisables et une etude de cas detaillee

325 Pages·2008·4.86 MB·French

by  Michel Plasse

G11965_Ajax_XP 28/08/06 10:13 Page 1
Développez
e
s
s Développez
a
Ajax l
P

.
M
en
M. Plasse Ajax
Michel Plasse est
formateur et consultant.
Il a une expérience de plus
Des applications Web plus réactives et plus riches
de dix ans des projets
Popularisé par des sites innovants tels que les webmails de Google et Yahoo, Google Maps, Flickr, Writely informatiques chez en
ou NetVibes, Ajax est un ensemble de technologies permettant de construire des applications Web de des grands comptes
nouvelle génération, plus réactives et aux interfaces utilisateur plus riches, comparables en fonctionnalité et éditeurs de logiciels.
aux applications natives Windows ou Mac OS. Depuis 1999, il organise x
et anime pour un public
Maîtriser les technologies sous-jacentes et les frameworks Ajax de développeurs
a
Après avoir présenté des exemples typiques d’utilisation d’Ajax, cet ouvrage étudie en profondeur les techniques et de chefs de projets
sous-jacentes (CSS et DOM, JavaScript objet, XMLHttpRequest, JSON, XML et XSLT) en les illustrant des formations
d’exemples d’applications variées et de complexité croissante. approfondies (cinq mois) j
sur Java et l’objet, Avec quinze exemples de composants
Il présente également plusieurs des frameworks qui facilitent le développement d’applications Ajax, notamment les technologies Web A
prototype, dojo et script.aculo.us.
et J2EE, XML et Ajax.
réutilisables et une étude de cas détaillée
Il peut être joint
Acquérir par l’exemple les meilleures pratiques de développement Ajax
sur son site
L’ouvrage donne des réponses précises aux questions délicates soulevées par Ajax, notamment la gestion des http://mplasse.free.fr.
appels asynchrones (parallélisme et mise en cache), le choix des formats d’échange et les actions Page
n
précédente ou Ajouter aux favoris.
L’auteur souligne l’importance du développement par composants en l’illustrant de quinze exemples facilement e
réutilisables. Il insiste tout particulièrement sur les bonnes pratiques de conception et montre à travers une
étude de cas détaillée, un site de vente en ligne «ajaxifié», comment intégrer Ajax dans l’architecture MVC.
z
e
p
Au sommaire
o
p
Qu’est-ce qu’Ajax? • Exemples typiques d’utilisation • Un premier exemple simple •Le HTML dyna- m p
o
mique avec DOM et CSS • Les composants JavaScript: outils d’aide au développement, fonction- C
d M i c h e l P l a s s e
nalités objet de JavaScript, exemples de création de composants réutilisables • Communication or o
N
asynchrone avec le serveur: l’objet XMLHttpRequest, sécurité, gestion du cache, appels parallèles, :
n
ppraogbel)è m•eÉsc hda’enngceosd daeg ed, oenxneémesp leXsM dL’ aeptp JlicSaOtNio nv s( sHuTgMgeLs,t ieoxne mdep lseasi sdie’a,p mpliiscea tàio njo (ulre cdt’euunr frdaeg fmluexn Rt SdSe nceptio el
avec DOM puis avec XSLT) • Les frameworks Ajax et Web 2.0 (prototype, script.aculo.us, Rico, o
C v
dojo…), exemples d’utilisation (glisser-déposer, widgets, édition de texte WYSIWYG) •Questions
fdoéntcatililoénen.elles soulevées par Ajax • Intégration d’Ajax dans les architecture Web • Étude de cas :G119652-11965-8 119657 Dé
eur21 2
@ STéulré cleh asrigtee zw lwe wc.oeddeit isoonusr-ceeyr odleless e.cxoemmples du livre. Code éditISBN:2- 978221
36€
Remerciements
Mes remerciements vont aux personnes suivantes :
Tout d’abord Olivier Salvatori, qui s’est chargé de la relecture de cet ouvrage et de
l’important travail d’indexation. Sa relecture constructive et précise, sa réactivité et la
qualité de son écoute ont été motivantes et instructives.
Eric Pruvost, qui m’a suggéré d’écrire un livre sur Ajax. Nos discussions fréquentes et
notre étroite collaboration depuis des années ont alimenté ma réflexion, notamment
concernant les architectures Web et les bonnes pratiques de développement.
Paul Athanassiadis, qui a suivi de près les investigations sur les différentes questions
soulevées par Ajax, tant techniques que conceptuelles ou fonctionnelles, et a examiné les
exemples et le code d’une grande partie de l’ouvrage.
Benoît Gandon, qui a également examiné les exemples et le code d’une partie de
l’ouvrage.
Enfin, Emmanuelle Gautier et Joël Rigoult, qui m’ont mis en relation avec les éditions
Eyrolles.
Avant-propos
Popularisé par des sites innovants tels que Google Suggest, Google Maps, les webmails
de Google et Yahoo, writely, iRows ou netvibes, Ajax (Asynchronous JavaScript And
XML) est un ensemble de technologies permettant de construire des applications Web de
nouvelle génération, comparables en fonctionnalités aux applications natives Windows
ou Mac OS.
Ajax associe le HTML dynamique, qui permet de modifier le contenu ou l’apparence de
la page localement (sans redemander une nouvelle page au serveur), avec des appels
asynchrones au serveur, qui récupèrent juste les fragments à mettre à jour. Ces technolo-
gies existant depuis plusieurs années, Ajax est disponible aujourd’hui dans les naviga-
teurs installés, tels Internet Explorer 6, Firefox 1.x, Safari 1.3, Opera 8.5, etc.
Ajax rend les applications Web plus réactives et leurs interfaces utilisateur plus riches.
La réactivité tient à trois facteurs :
• Fluidité : les échanges avec le serveur sont à la fois plus fréquents et d’un volume plus
réduit, ce qui « lisse » la mise à jour dans le temps. De plus, ces mises à jour étant
asynchrones, elles peuvent se dérouler en parallèle et ne bloquent pas l’utilisateur.
• Rapidité : les échanges étant d’un volume plus réduit, le transfert est plus rapide, de
même que le traitement local pour mettre à jour l’affichage.
• Sensibilité : les application peuvent réagir à plus d’événements, notamment à ceux liés
à la saisie clavier.
La richesse d’interface tient aussi à trois facteurs :
• Richesse des composants graphiques : en plus des formulaires et des liens, qui sont, en
HTML, les principaux éléments réactifs, il est possible de disposer d’onglets, de boîtes
flottantes, d’arborescences, de menus, d’info-bulles, de calendriers, etc.
• Support du glisser-déposer et, dans une certaine mesure, de mécanismes de défaire/refaire.
• Support de l’édition WYSIWYG.
Les applications Ajax combinent ainsi la puissance et la qualité de l’interface utilisateur
du client lourd avec l’absence de déploiement du client léger, constituant par là ce qu’on
appelle aujourd’hui le client riche.
Développez en Ajax
IV
Objectifs de l’ouvrage
Cet ouvrage vise à guider le lecteur dans la réalisation d’applications Ajax. Il couvre trois
grands axes : les technologies constitutives d’Ajax, les questions fonctionnelles et techni-
ques soulevées, avec les réponses qu’il est possible d’y apporter, et enfin les méthodes et
outils qui facilitent et rendent plus sûr le développement.
Les technologies comportent :
• Le HTML dynamique, c’est-à-dire DOM (Document Object Model), ou modèle objet
du document, et les CSS (Cascading Style Sheets), ou feuilles de style en cascade,
combinés avec JavaScript.
• XMLHttpRequest, l’objet JavaScript permettant d’effectuer des requêtes HTTP asyn-
chrones vers le serveur.
• JSON (JavaScript Object Notation), ou notation objet en JavaScript, ainsi que XML et
les technologies associées, notamment XSLT et XPath.
Les questions soulevées concernent la gestion des appels asynchrones, la conception et
l’utilisation de composants graphiques (comme la suggestion de saisie) ou fonctionnels
(comme un panier dans une application de vente en ligne), la complexité du code
JavaScript induite par la richesse des fonctionnalités du client et l’intégration d’Ajax
dans les applications Web existantes.
Les solutions à ces problèmes reposent en grande partie sur des méthodes et des
frameworks : pour faire face à la complexité du code, celui-ci doit être conçu de façon
modulaire, en faisant appel à la programmation objet de JavaScript, à des bibliothèques
de composants JavaScript et à une architecture MVC (modèle, vue, contrôleur).
Cette dernière, qui a démontré sa valeur côté serveur ainsi que dans les applications à
client lourd, se révèle désormais utile aussi côté client en Web. Elle se prolonge par la
séparation nette entre le code HTML, concentré sur la structure et le contenu, le code
JavaScript en charge du comportement, et les CSS, qui gouvernent l’apparence.
Les méthodes valant avant tout par l’exemple (« faites ce que je fais » étant en cette
matière plus efficace que « faites ce que je dis »), elles sont constamment mises en prati-
que dans cet ouvrage.
L’objectif de celui-ci est en effet double : installer chez le lecteur des bases solides et le
rendre opérationnel rapidement à travers des réalisations d’ampleur progressive, le
dernier chapitre incluant une étude de cas illustrant comment concevoir et réaliser une
application « ajaxifiée ».
Organisation de l’ouvrage
Dans chaque chapitre, l’ouvrage part du besoin, l’objectif à atteindre, et guide progressi-
vement le lecteur vers cet objectif. La succession des chapitres vise également à faciliter
cette progression. L’explication des techniques est illustrée par des exemples, que le
Avant-propos
V
lecteur pourra, dans certains cas, réutiliser dans ses propres projets. L’auteur insiste sur
les fondements de chaque technologie et les pratiques conseillées et indique les points
délicats, facteurs de bogues fréquents.
Le chapitre 1 examine ce qu’apporte Ajax et liste notamment les cas typiques où il offre
un réel avantage. Une grande partie des exemples présentés ici sont développés dans les
chapitres suivants. Les fonctions et le code d’un exemple simple sont examinés en détail
afin de montrer comment s’imbriquent les différentes composantes du code.
Il n’est pas possible de faire de l’Ajax sans faire du HTML dynamique, qui consiste à
modifier le contenu, la structure ou l’apparence d’une page Web sans aucun appel au
serveur. La réciproque est fausse. Aussi est-il plus facile de commencer par le HTML
dynamique, auquel le chapitre 2 est consacré. Ce chapitre fait un point sur les feuilles de
style CSS et sur l’API DOM, qui permet de manipuler la structure, le contenu et l’appa-
rence de la page Web et de gérer les événements liés aux actions de l’utilisateur.
Les applications Ajax faisant massivement appel à des composants, le chapitre 3 se
penche sur les aspects objet et avancés de JavaScript, qui sont très particuliers et peuvent
être déroutants tant pour les développeurs Java ou C# que pour ceux qui n’ont pas une
grande habitude de la programmation objet. Le chapitre est illustré par la création de
composants graphiques et d’une suggestion de saisie en local (comme sur le site de la
RATP). Ce chapitre est fondamental, car tous les exemples des chapitres suivants cons-
truisent (ou font appel à) des composants JavaScript.
Le chapitre 4 est dédié à la communication avec le serveur via des requêtes XMLHttpRequest.
Après un point sur le protocole HTTP, il examine les questions soulevées par les appels
Ajax : gestion du cache, méthodes GET et POST, requêtes parallèles, cookies, sécurité. Les
exemples incluent une suggestion de saisie par appels au serveur et la mise à jour dyna-
mique d’une liste déroulante, réalisées sous forme de composants.
Le chapitre 5 traite de l’échange de données XML ou JSON entre le client et le serveur.
Il examine et compare les différents formats d’échanges (texte, HTML, XML et JSON).
Les spécificités de XML et de son DOM par rapport au HTML y sont indiquées. Il traite
aussi de XSLT (transformations XML) et XPath. Les technologies sont illustrées par un
lecteur RSS, d’abord dans une version simple faisant appel à DOM, puis dans une
version plus élaborée faisant appel à XSLT.
Le chapitre 6 aborde les « frameworks » Ajax. Il commence par différencier bibliothè-
ques et frameworks, puis examine les critères de choix à prendre en compte et compare
les produits disponibles. Il étudie en particulier dojo et prototype.js, les deux bibliothè-
ques les plus anciennes et, semble-t-il, les plus utilisées actuellement. Le chapitre est
illustré de nombreux exemples d’utilisation, notamment une mise en œuvre du glisser-
déposer et un éditeur WYSIWYG.
Le chapitre 7 et dernier est consacré aux applications Ajax et Web 2.0. C’est le plus
important du point de vue de la conception et de l’architecture. Il examine les questions
soulevées par Ajax, en particulier l’absence de support des actions Page précédente et
Ajouter aux favoris. Il détaille l’impact d’Ajax sur les architectures Web, en particulier le
Développez en Ajax
VI
modèle MVC. Une étude de cas conclut le chapitre et l’ouvrage en montrant qu’au MVC
côté serveur s’adjoint dans les cas complexes un MVC côté client.
Chaque chapitre s’appuie sur les connaissances acquises au cours des chapitres précé-
dents et les enrichit. À l’issue de ce parcours, le lecteur aura un bagage solide et dispo-
sera de composants directement utilisables, lui permettant d’aborder ses projets Ajax en
étant opérationnel.
Table des matières
Remerciements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . I
Avant-propos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . III
Objectifs de l’ouvrage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . IV
Organisation de l’ouvrage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . IV
CHAPITRE 1
Introduction à Ajax . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
Qu’est-ce qu’Ajax ? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
Mise à jour d’une partie de la page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2
Communication asynchrone avec le serveur . . . . . . . . . . . . . . . . . . . . . . . . 3
Techniques mises en œuvre . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
Exemples typiques où Ajax est utile . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
Validation et mise à jour d’une partie de la page . . . . . . . . . . . . . . . . . . . . 5
Aide à la saisie, notamment suggestion de saisie . . . . . . . . . . . . . . . . . . . . 7
Lecture de flux RSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
Tri, filtrage et réorganisation de données côté client . . . . . . . . . . . . . . . . . . 9
Édition WYSIWYG de documents . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
Diaporamas et autres applications documentaires . . . . . . . . . . . . . . . . . . . . 11
Débranchement dans un scénario . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
Visualisation graphique avec SVG . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
Rafraîchissement d’une branche d’une arborescence . . . . . . . . . . . . . . . . . 13
Chargement progressif de données volumineuses . . . . . . . . . . . . . . . . . . . . 14
Exemple Ajax simple . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
Le code côté serveur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
Le code côté client . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
La requête XMLHttpRequest . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22
Développez en Ajax
VIII
Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
CHAPITRE 2
Le HTML dynamique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
Balises, arbre et boîtes HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
Les CSS (Cascading Style Sheet) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
Les règles CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
Boîtes et dimensions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32
Afficher/masquer un élément . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
Les calques et le positionnement des boîtes . . . . . . . . . . . . . . . . . . . . . . . . 35
DOM (Document Object Model) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40
Les interfaces DOM . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41
Peupler une liste de suggestions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43
Positionnement de la liste de suggestions . . . . . . . . . . . . . . . . . . . . . . . . . . 44
Récupération de nœuds . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46
DOM Events . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 48
Événements reconnus par les navigateurs . . . . . . . . . . . . . . . . . . . . . . . . . . 49
Programmation événementielle mais traitement séquentiel . . . . . . . . . . . . 50
Association d’une réaction à un événement . . . . . . . . . . . . . . . . . . . . . . . . 51
Ordre des événements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53
Propagation des événements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 56
Les événements clavier . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60
Les événements liés à la souris . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63
En résumé . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 65
Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 65
CHAPITRE 3
Les composants JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 67
Outils d’aide au développement . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 68
Fonctionnalités objet de JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69
Différences avec Java, Eiffel et C# . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70
Les objets JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71
La notation JSON . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73
Les fonctions anonymes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74
Le mot-clé this . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 78
Les constructeurs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79
Table des matières
IX
Les prototypes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81
Le mécanisme de fermeture . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 91
this et les événements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92
En résumé . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 94
Création de composants JavaScript réutilisables . . . . . . . . . . . . . . . . . . 94
La boîte d’information . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 94
Les onglets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 105
Suggestion de saisie . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 112
Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 127
CHAPITRE 4
Communication avec le serveur via XMLHttpRequest . . . . . . 129
L’objet XMLHttpRequest . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 130
Rappels sur HTTP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 130
Instanciation d’une requête XMLHttpRequest . . . . . . . . . . . . . . . . . . . . . . . 135
Requêtes synchrones ou asynchrones ? . . . . . . . . . . . . . . . . . . . . . . . . . . . . 137
Cycle de vie de la requête . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 138
XMLHttpRequest et la sécurité . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 143
Gestion du cache . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 143
Les problèmes d’encodage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 148
Les requêtes parallèles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 152
En résumé . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 157
Applications exemples . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 157
Suggestion de saisie . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 157
Mise à jour d’une partie de la page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 166
Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 175
CHAPITRE 5
Échange de données en XML ou JSON . . . . . . . . . . . . . . . . . . . . . . 177
XML (eXtensible Markup Language) . . . . . . . . . . . . . . . . . . . . . . . . . . . 178
Documents bien formés . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 178
Choix de la structure des données . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 182
Le DOM XML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 186
La mise à jour partielle avec XML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 187
JSON (JavaScript Object Notation) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 189
Communication JSON entre JavaScript et PHP . . . . . . . . . . . . . . . . . . . . . 191
Développez en Ajax
X
La mise à jour partielle avec JSON . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 193
Comparaison des formats d’échange . . . . . . . . . . . . . . . . . . . . . . . . . . . . 195
Exemple d’application avec les flux RSS . . . . . . . . . . . . . . . . . . . . . . . . . 197
Les formats RSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 198
Le serveur comme mandataire HTTP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 200
Le composant lecteur de RSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 201
Affichage du flux . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 204
En résumé . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 207
XSLT (eXtensible Stylesheet Language Transformations) . . . . . . . . . . 208
XPath . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 209
Fonctionnement de XSLT . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 211
La syntaxe XSLT . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 212
Les espaces de noms . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 215
Exemple de transformation XSLT . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 216
Exemple d’application de lecteur RSS avec XSLT . . . . . . . . . . . . . . . . . 219
Le composant XSLView . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 221
La transformation XSLT . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 224
La page HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 226
Conclusion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 230
CHAPITRE 6
Les « frameworks » Ajax . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 233
Boîtes à outils, bibliothèques et frameworks . . . . . . . . . . . . . . . . . . . . . . 233
Les bibliothèques JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 235
prototype.js . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 236
Fonctions et objets utilitaires . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 237
Encapsulation et extensions de DOM . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 240
Les appels XMLHttpRequest . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 242
script.aculo.us . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 245
rico . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 247
dojo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 249
Fonctions et objets utilitaires . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 252
Encapsulation et extensions de DOM . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 255
Les appels Ajax . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 256
Les widgets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 261