Le site de Patrick Darcheville

Tutoriel JavaScript & Jquery

Initiation JavaScript & jQuery

Apprentissage JavaScript & jQuery

Débuter en JavaScript & jQuery

JavaScript & jQuery pour les nuls

Tuto JavaScript & jQuery

Tutoriel Javascript & jQuery

Ci-dessus une animation réalisée en HTML & JS.

Une page web créée avec du HTML est totalement statique et n'offre que très peu de possibilités d'interactions avec le visiteur.
Pour produire des effets visuels (sur clic, survol, chargement de la page, etc.) il faut souvent recourir à la programmation en JavaScript même si le CSS dans sa dernière version offre des possibilités intéressantes avec les nouvelles propriétés telles transform, transition, animation.
Mais pour manipuler le DOM (modifier certains noeuds, ajouter ou supprimer des noeuds) vous êtes obligé de recourir à JavaScript.

Le monde JavaScript c'est des centaines de bibliothèques contenant des fonctions de haut niveau. Donc ne cherchez pas à "réinventer la roue" ...
Ainsi, pour prendre un seul exemple, programmer un "drag and drop" avec le Javascript de base est un "parcours du combattant" mais devient un jeu d'enfant si vous utilisez le framework jQuery et plus précisément son extension jQuery UI.
Autre exemple : avec jQuery Mobile c'est très simple de créer la version mobile d'un site.

Désormais JavaScript peut être utilisé côté serveur (Node.js) !
La technologie AJAX (Asynchronus JavaScript And Xml) avait amorcé l'utilisation de JavaScript côté serveur. Grâce à AJAX une page peut être actualisée avec des données provenant du serveur sans qu'il soit nécessaire de la recharger complètement (comme avec une requête HTTP). JQuery propose des méthodes pour faciliter l'écriture de requêtes AJAX !

La version 5 de HTML a ajouté de nombreuses API JavaScript. Citons Canvas, la géolocalisation, le WebStorage, API selectors, etc. Ces API JavaScript ne sont pas traitées dans ce tutoriel mais dans celui relatif à HTML5 (dans le même site). Vu l'importance de l'API Canvas (pour dessiner dans une page web) un tutoriel complet lui est dédié.
Google proprose aussi des API JavaScript en ligne. Citons Google Translate que j'utilise dans cette page ainsi que Google Maps très pratique dans le cadre de la géolocalisation.

Attention JavaScript peut être désactivé par le navigateur. C'est une situation très fréquente dans les entreprises (pour des raisons de sécurité). En cas de script dans une page prévoyez donc le conteneur NOSCRIPT : le code HTML contenu dans cette balise s'éxécute uniquement si l'exécution du JS est bloquée par le navigateur.

Les différents chapitre de ce tuto

Dans chaque page des extraits de code figurent dans des encadrés roses. Sur les mobiles, seules les premières lignes apparaissent. Il suffit de toucher l'encart pour le déplier.