Effacer l'attribut IMG SRC à l'aide de JavaScript

Effacer l'attribut IMG SRC à l'aide de JavaScript

Lors de la conception d'une page ou d'un site Web interactive, il peut y avoir une exigence pour passer entre différents éléments de temps à autre. Par exemple, dans le processus d'ajout de techniques de reconnaissance CAPTCHA et d'image ou de cacher un élément particulier pour l'utilisation appropriée du modèle d'objet de document (DOM). Dans de tels cas, la compensation de l'attribut IMG SRC est bénéfique pour garantir la conception de documents accessibles et faire ressortir le site.

Ce blog expliquera comment effacer l'image de l'attribut SRC à l'aide de JavaScript.

Comment effacer l'attribut IMG SRC à l'aide de JavaScript?

Pour effacer l'attribut IMG SRC à l'aide de JavaScript, les approches suivantes peuvent être utilisées:

    • "removeAttribute ()" méthode.
    • "afficher" propriété.
    • "visibilité" propriété.

Suivons chacune des approches une par une!

Approche 1: Effacer l'attribut IMG SRC dans JavaScript à l'aide de la méthode RemoveAttribute ()

Le "removeAttribute ()»La méthode supprime l'attribut d'un élément. Cette méthode peut être utilisée pour effacer un attribut particulier entraînant la suppression de l'image spécifiée sur le bouton cliquer.

Syntaxe

élément.RemoveAttribute (nom)


Dans la syntaxe donnée:

    • "nom»Fait référence au nom de l'attribut.

Exemple

Suivons l'exemple indiqué ci-dessous:









Dans l'extrait de code ci-dessus:

    • Spécifiez l'image indiquée ayant le spécifié "identifiant" et le "SRC" attribut.
    • Créez également un bouton avec un "sur clic”Événement invoquant la fonction clearAttribute ().
    • Dans le code JavaScript, définissez une fonction nommée «clearAttribute ()".
    • Dans sa définition, accédez à l'image incluse via «identifiant" en utilisant le "getElementByid ()" méthode.
    • Enfin, appliquez le «removeAttribute ()«Méthode pour supprimer le«SRC”Attribut, qui entraînera l'effacement de l'image sur le bouton cliquer.

Sortir


La sortie ci-dessus signifie que l'image spécifiée dans le «SRC»L'attribut efface sur le bouton cliquer.

Approche 2: Effacer l'attribut IMG SRC dans JavaScript à l'aide de la propriété d'affichage

Le "afficher»La propriété renvoie le type d'affichage de l'élément associé. Cette propriété peut être utilisée pour attribuer une valeur à l'élément correspondant de telle sorte que l'attribut contenu soit effacé sur le bouton cliquer.

Syntaxe

objet.style.affichage = valeur


Dans la syntaxe donnée:

    • "valeur»Fait référence à la valeur attribuée à la propriété d'affichage.

Exemple

Présentation de l'exemple suivant:









Dans les lignes de code ci-dessus, implémentez les étapes suivantes:

    • Rappelez-vous les approches pour inclure une image via le «SRC«Attribuez et créant un bouton ayant un«sur clic" événement.
    • Dans le code JavaScript, définissez la fonction "clearAttribute ()".
    • Dans sa définition, de même, accédez à l'image incluse à l'aide de la «getElementByid ()" méthode.
    • Enfin, attribuez la valeur "aucun”À la propriété d'affichage. Cela entraînera la compensation de l'image spécifiée dans le «SRC" attribut.

Sortir


La sortie ci-dessus indique que la fonctionnalité souhaitée est obtenue.

Approche 3: Effacer l'attribut IMG SRC dans JavaScript à l'aide de la propriété de visibilité

Le "visibilité»La propriété attribue la valeur telle qu'un élément devient visible ou non. Cette propriété peut être implémentée pour masquer l'élément associé, désactivant ainsi l'image spécifiée dans le «SRC”Attribut dans l'élément.

Syntaxe

objet.style.Visibilité = valeur


Dans la syntaxe donnée ci-dessus:

    • "valeur»Porte la valeur attribuée à l'élément associé.

Exemple

L'exemple donné ci-dessous illustre le concept déclaré:









Dans les lignes de code ci-dessus:

    • De même, spécifiez l'image indiquée ayant le spécifié "identifiant" et le "SRC" attribut.
    • Associer également un «sur clic”Événement avec le bouton créé rediriger vers la fonction clearAttribute ().
    • Dans la partie JavaScript du code, définissez une fonction nommée «clearAttribute ()".
    • Ici, de même, accédez à l'image incluse en utilisant le «getElementByid ()" méthode.
    • Enfin, attribuez la valeur "caché«À l'élément associé, je.e., image.
    • Cela cachera en conséquence l'image spécifiée dans le «SRC”Attribut, en l'effacement sur le bouton cliquer.

Sortir


L'image spécifiée est effacée à partir de DOM sur le clic du bouton, effacant ainsi le "SRC" attribut.

Conclusion

Le "removeAttribute ()"Méthode, le"afficher«Propriété, ou le«visibilité»La propriété peut être appliquée pour effacer l'attribut IMG SRC à l'aide de JavaScript. La méthode de removeAtTribut () peut être utilisée pour supprimer le "SRC”Attribut qui entraînera également l'effacement de l'image spécifiée. La propriété d'affichage masque l'affichage, effaçant ainsi l'image sur le bouton cliquer. La propriété de visibilité cache l'élément associé entraînant la nettoyage du contenu «SRC»Attribut également. Ce blog est guidé pour effacer l'attribut IMG SRC dans JavaScript.