Publié par le 7 décembre 2008, 0 commentaire

J’ai eu l’occasion dans mon boulot de découvrir JQUERY, la fameuse librairie JavaScript permettant d’appliquer des actions sur des évènements.

A force de l’utiliser et de la « défoncer » dans tous les sens, je commence à connaître quelques techniques d’utilisation et d’optimisation. A savoir, cette librairie à l’avantage d’être compatible avec tous les navigateurs.

Sa mise en place passe par l’inclusion HTML de la librairie (<script type= »text/javascript » src= »jquery.js » mce_src= »jquery.js »></script>), et permet d’accèder à une liste de fonctions et méthodes assez intéressante. Je citerai rapidement :

  • Gestion facile de requêtes AJAX.
  • Animation des fenêtres (slide, fade, move).

L’utilisation de plugin additionnels permet d’étendre les possbilitées :

  • tablesorter => permet de gérer l’affichage d’un tableau HTML, avec gestion des tries et de la pagination (via tablesorterpager).
  • datepicker => permet de générer un calendrier de saisie/affichage dynamique en JavaScript, avec animation sur l’apparition/disparition.

JQUERY permet facilement d’accèder à l’arbre DOM de la page JavaScript, de mettre en place des Triggers/Ecouteur sur des évènements liés à des objets de l’arbre.

Exemple :

$(document).ready(function(){

});

Ce code permet d’executer des actions lorsque la page est correctement chargée. Ainsi, on va pouvoir ajouter des triggers sur des balises.

$('#maDiv').click(function(){
  $this.hide();
}

Ce trigger permet, lorsqu’on clique sur l’élément dont l’id sera ‘maDiv’ de le masquer.

La suite va venir, avec de vrais exemples et des démos.