10 juin 2007
DOM Assistant, pour manipuler facilement le DOM
Article publié dans la catégorie javascript | lu 1306 fois |

DOM Assistant est un librairie javascript qui permet de simplifier la manipulation du DOM.
Cette librairie qui n’a pas les prétentions d’un jQuery ou autres prototypes, permet par contre de gagner du temps quand on a besoin de manipuler un peu de DOM.
L’écriture est très intuitive ( un peu sur le modèle d’un jQuery),et le package ne pèse que elle pèse que 5Ko
La librairie se présente sous la forme de 5 fichiers modulaires. Le moteur de la librairie et 4 modules annexes a importer selon les besoins.
Cette classe est compatible avec la plupart des navigateurs modernes.
Dom Assistant: Ce sont les fonctions de base. On y retrouve des fonctions pour cibler au sein du DOM.
[javascript]
//retourne des tableaux avec les elements trouvés
$(”container”).getElementsByClassName(”maClass”);
$(”container2″).getElementsByAttribute(”align”,”right”);
$(”container3″).getElementsByAttribute(”type”, “text”, “input”);
[/javascript]
DOMAssistantContent: Ce module permet de pousser plus loin la navigation dans les noeuds du DOM.Ajouter, supprimer, remplacer
[javascript]
//pour naviguer dans au seins de noeuds
$(”container”).prev();
$(”container”).next();
//créer des noeuds
$(”container”).create(”div”);
$(”container”).create(”div”, {id : “my-div”,className : “my-class”});
//modifier des attributs
$(”container”).setAttributes({id : “my-div”,className : “my-class”});
//modifier, rajouter du contenu
$(”container”).replaceContent(”<p>A new paragraph</p>”);
$(”container”).replaceContent(document.createElement(”p”));
[/javascript]
DOMAssistantCSS: Ce module permet de manipuler les classes et les styles CSS des Éléments.
[javascript]
//ajouter supprimer une classe
$(”container”).addClass(”selected”);
$(”container”).removeClass(”selected”);
//vérifier une classe
$(”container”).hasClass(”selected”);
//récupérer les pripriété d’un style
$(”container”).getStyle(”background-color”);
[/javascript]
DOMAssistantEvents : gestionnaire d’évènements crross-browser qui implémente des écouteurs d’action sur les éléments.
[javascript]
$(”container”).addEvent(”click”, maFonction);
$(”container”).removeEvent(”click”, maFonction);
[/javascript]
DOMAssistantLoad: fonction appellée a la fin du chargement du DOM. permet de lancer l’execution de fonctions sans attendre la fin du chargement des images ou des fichiers flash ( pour faire un preloader par exemple ).