Orsys

JQuery, développer des applications Web interactives

Par Orsys

Objectifs

  • Développer des applications Web interactives "cross-browser"
  • Maîtriser les sélecteurs et les méthodes jQuery d'accès aux éléments d'une page Web
  • Gérer des évènements d'interaction avec l'utilisateur
  • Intégrer des effets visuels et des animations au sein de pages Web
  • Interagir avec un serveur en Ajax

Programme

Présentation de jQuery

  • Qu'est-ce que jQuery ? Pourquoi jQuery ?
  • L'apport par rapport à Javascript simple.
  • Les éléments jQuery. jQuery UI. L'objet jQuery.

Travaux pratiques
Installation de jQuery. Mise en place d'une première page Web utilisant jQuery.

Méthodes utilitaires de jQuery

  • Rappel sur les objets en Javascript.
  • La manipulation d'objets avec jQuery.
  • Les méthodes de traitement d'objets de jQuery.
  • Les méthodes de traitement de tableaux en jQuery.
  • Les chaînes de caractères et Javascript.
  • Les méthodes de traitement de chaînes de jQuery.

Travaux pratiques
Mise en place d'applications Web avec différents types d'éléments en utilisant jQuery.

Les sélecteurs

  • Présentation des sélecteurs jQuery.
  • Rôle des sélecteurs. Les différents types de sélecteurs.
  • Les pseudo-classes. Les combinateurs.

Travaux pratiques
Mise en place d'applications Web utilisant des sélecteurs.

Accès à l'arbre DOM

  • Rappel sur DOM (Document Object Model).
  • Accès direct aux éléments d'une page.
  • Manipulation de DOM avec jQuery.
  • Gestion des classes CSS (addClass(), removeClass()...
  • Insertion d'éléments dans l'arbre DOM.

Travaux pratiques
Manipulation de l'arbre DOM.

La gestion des événements

  • La notion d'événements en Javascript.
  • Gestion des événements avec la méthode bind.
  • Transmission de paramètre avec la méthode bind.

Ajax et jQuery

  • Requêtage d'un serveur avec jQuery.
  • Requêtes Ajax en utilisant $.ajax().
  • Traitement de la réponse du serveur.
  • Transmission de paramètres au serveur.

Travaux pratiques
Utilisation d'Ajax avec jQuery.

Effets visuels et interface riche avec jQuery

  • Les effets visuels standard de jQuery. Créer ses propres effets visuels. Utilisation d'animate().
  • Paramétrage d'effet avec easing. Gestion de la file d'attente des effets visuels.
  • Présentation et installation de jQuery UI. Utilisation de composants évolués.
  • Onglets (tabs(), accordéon (accordion()), boîte de dialogue (dialog()), barres de progression (progressbar()).
  • Le glissé/déposé. Sélection multiple. Permutations d'éléments dans une page. Redimensionnement d'élément.

Travaux pratiques
Mise en place d'effets visuels.

Pédagogie

Mise en place d'applications Web utilisant jQuery.

Formations de la même catégories (5)

Feel Europe
Développement JavaScript avec JQueryPar Feel Europe
  • Rédiger facilement et de manière maintenable les interactions JavaScript de vos page Web à l'aide de jQuery : animations, validation, AJAX et autres fonctionnalités caractéristiques du Web 2.0
ENI SERVICE
jQuery – Développement Web Front End en JavaScriptPar ENI SERVICE

Dans cette formation, vous apprendrez à industrialiser, structurer et optimiser vos développements d'applications Web JavaScript en utilisant le framework jQuery.

Dawan
jQueryPar Dawan
  • Construire des interfaces performantes avec jQuery - Développer des plugins additionnels
M2i Formation
JavaScript et jQuery pour les designersPar M2i Formation
  • Comprendre les bases de JavaScript et du DOM
  • Juger de l'intérêt de jQuery pour la programmation Cross-browser
  • Gérer les évènements et les manipulations dynamiques avec jQuery
  • Réaliser des appels synchrones (Ajax) avec jQuery
  • Utiliser des plugins jQuery.
Dawan
Webmaster Avancé : Javascript/JQuery (Certification Microsoft 70-480)Par Dawan

Découvrir le potentiel des nouvelles normes HTML5/CSS3 - Apprendre à faire des sites multiplateforme : smartphone, tablette,.... - Générer un flux RSS - Découvrir XML, Ajax et jQuery

Nous utilisons les cookies afin de fournir les services et fonctionnalités proposés sur notre site et afin d’améliorer l’expérience de nos utilisateurs. En cliquant sur ”J’ai compris”, vous acceptez l’utilisation de ces cookies.