Fil d'ariane : DaWeed.info » javascript » DOM Assistant, pour manipuler facilement le DOM

10 juin 2007

DOM Assistant, pour manipuler facilement le DOM

Article publié dans la catégorie javascript | lu 3455 fois |

DOM Assistant 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:
  1. //retourne des tableaux avec les elements trouvés
  2. $("container").getElementsByClassName("maClass");
  3. $("container2").getElementsByAttribute("align","right");
  4. $("container3").getElementsByAttribute("type", "text", "input");

  DOMAssistantContent: Ce module permet de pousser plus loin la navigation dans les noeuds du DOM.Ajouter, supprimer, remplacer
JAVASCRIPT:
  1. //pour naviguer dans au seins de noeuds
  2. $("container").prev();
  3. $("container").next();
  4.  
  5. //créer des noeuds
  6. $("container").create("div");
  7. $("container").create("div", {id : "my-div",className : "my-class"});
  8.  
  9. //modifier des attributs
  10. $("container").setAttributes({id : "my-div",className : "my-class"});
  11.  
  12. //modifier, rajouter du contenu
  13. $("container").replaceContent("<p>A new paragraph</p>");
  14. $("container").replaceContent(document.createElement("p"));

  DOMAssistantCSS: Ce module permet de manipuler les classes et les styles CSS des Éléments.
JAVASCRIPT:
  1. //ajouter supprimer une classe
  2. $("container").addClass("selected");
  3. $("container").removeClass("selected");
  4.  
  5. //vérifier une classe
  6. $("container").hasClass("selected");
  7.  
  8. //récupérer les pripriété d'un style
  9. $("container").getStyle("background-color");

  DOMAssistantEvents : gestionnaire d'évènements crross-browser qui implémente des écouteurs d'action sur les éléments.
JAVASCRIPT:
  1. $("container").addEvent("click", maFonction);
  2. $("container").removeEvent("click", maFonction);

  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 ).

Commentaires