Comment modifier un attribut du DOM avec le Framework Dojo

fermer la fenetre

Des Applications Performantes Sans Vous Prendre La Tête !

Recevez la formation "Développement Facilte" GRATUITEMENT
Avec tous les Codes Sources Commentés
 
(Les événements, la programmation orientée objets, les modèles de conception, Les éditeurs, les outils, 
l'efficacité, CSS3, HTML5, JavaScript, jQuery, Dojo...)

Renseignez votre prénom et votre adresse email ci-dessous :

Apprenez à modifier rapidement les attributs d’un élément du DOM en direct avec le Framework Dojo.

Par exemple, ajoutez ou supprimez des classes CSS, ajoutez ou supprimez des attributs d’un élément HTML…

Tout est dans la formation ci-dessous.

[ppmaccordion][ppmtoggle title=”Affcher le texte de la vidéo”]

Comment modifier un attribut du DOM avec le Framework Dojo

Bonjour à tous et bienvenu sur Développement Facile.

Dans ce nouveau cours toujours consacré à Dojo toolkit le Framework JavaScript qui va vous aider à faire des applications web exceptionnelles, et là, vous allez apprendre à manipuler les attributs, si vous avez vu les cours sur jQuery, ça va vous rappeler de très bons souvenirs.

Modifier un attribut

Pour modifier un attribut, manipuler un attribut avec Dojo, il y a la propriété dojo.attr, qui permet de modifier les attributs et leur valeur, donc si l’attribut existe déjà, la valeur est modifiée, sinon l’attribut est ajouté à l’élément concerné. Donc dojo.attr le nœud, div, p a, img, le nom de la balise l’attribut, et sa valeur, tout simplement, rien de très compliqué.

Vérifier la présence d’un attribut

Vous pouvez également vérifier la présence d’un attribut avec la fonction dojo.hasAttr ça va vous renvoyer un booléen true si l’attribut est présent ou false s’il est absent, donc vous faites dojo.hasAttr sur une div, un paragraphe, div.classe1, div# identifiant et l’attribut, le nom de l’attribut que vous souhaitez vérifier.

Supprimer un attribut

Vous pouvez supprimer un attribut, bien évidemment, donc là vous faites dojo.removeAttr, le nœud div.classe, div# identifiant ou div tout court, et le nom de l’attribut pour supprimer l’attribut du bloc l’élément que vous souhaitez.

Alors, un exemple de code source avec ça, regardez il y a plusieurs boutons, modifier le style, afficher le style, vérifier la présence d’un attribut, afficher l’image, et à chaque fois on appelle une fonction JavaScript, voilà, sur le onClik on appelle une fonction JavaScript, et en fonction de la fonctionnalité que l’on a implémentée, on va effectuer différentes choses, là on va modifier le style CSS en ajoutant l’attribut sur la balise texte, ici, là on va faire un inner HTML sur la balise result, avec l’Id result, on va vérifier si il y a des attributs, on va indiquer s’ils sont présents ou non.
Et là on va enlever l’attribut image style, l’attribut image style il a display = none, l’image va apparaitre. Aller, je modifie le style, le style est modifié, j’affiche le style, et je vérifie la présence des attributs. Il y a un identifiant et un style, je recharge la page, je vérifie la présence des attributs, voyez qu’ils sont différents, il y a juste un Id, je modifie le style, je revérifie le style, je peux afficher le style également, et là, je clique pour afficher l’image.

Votre plan d’actions !

En trois lignes de code, non j’exagère un peu, il y a une dizaine de lignes de codes, vous faites des applications qui ont des fonctionnalités que vous implémentez dans vos applications Web vraiment très pratique, comme d’habitude vous retrouverez le code source sous ce cours vidéo, si vous avez des questions, posez-les sous ce cours vidéo et moi je vous dis à très vite sur Développement Facile.

 

[/ppmtoggle][/ppmaccordion]

Téléchargez l’exemple Dojo

Retrouvez un exemple de code JavaScript avec le Framework Dojo.

Downloads

Dites-moi ce que vous voulez apprendre avec le Framework Dojo

Utilisez la zone commentaires, pour choisir les fonctionnalités que vous voulez connaitre avec le Framework Dojo.

Créez Rapidement des Sites Hyper-Interactifs avec vos utilisateurs grâce à la Formation Gratuite jQuery Facile !

Recevez les Stratégies pour utiliser le Potentiel des Frameworks jQuery et Dojo
+
Logo jQuery
+
Des Tutoriels Gratuits Supplémentaires pour utiliser toute la "Richesse" du Framework de Google : AngularJS