Aller au contenu

Comment modifier un attribut du DOM avec le Framework Dojo

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.

Téléchargement du code source Exemple de modification d'attributs avec le Framework Dojo

Cliquez ici pour télécharger le code source Exemple de modification d'attributs avec le Framework Dojo

Téléchargement du code source Framework Dojo complet : dojo-release-1.9.3

Cliquez ici pour télécharger le code source Framework Dojo complet : dojo-release-1.9.3

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.

EXCLUSIF : Les 7 Secrets Révélés de JavaScript pour Créer VOS Applications — dès la semaine prochaine !

EXCLUSIF : La formation « JavaScript Facile » OFFERTE pour Créer VOS Applications — dès la semaine prochaine !

EXCLUSIF : Créez VOS Applications JavaScript — en moins de 7 jours grâce à notre formation OFFERTE « JavaScript Facile »

Que diriez-vous de Développer des Applications JavaScript Performantes — dès la semaine prochaine ?

TÉLÉCHARGEZ : Les codes sources du livre « JavaScript Facile » pour Créer VOS Applications — dès la semaine prochaine !

Cliquez ici pour tout recevoir >>