Cancella attributo IMG SRC usando JavaScript

Cancella attributo IMG SRC usando JavaScript

Durante la progettazione di una pagina Web interattiva o un sito, può esserci un requisito per la transizione tra vari elementi di volta in volta. Ad esempio, nel processo di aggiunta di tecniche di riconoscimento CAPTCHA e delle immagini o nascondere un particolare elemento per l'utilizzo appropriato del modello Object Document (DOM). In tali casi, la compensazione dell'attributo IMG SRC è utile per garantire la progettazione di documenti accessibile e far risaltare il sito.

Questo blog spiegherà come cancellare l'attributo SRC di immagine usando JavaScript.

Come cancellare l'attributo IMG SRC usando JavaScript?

Per cancellare l'attributo IMG SRC usando JavaScript, è possibile utilizzare i seguenti approcci:

    • "removeattribute ()" metodo.
    • "Schermo" proprietà.
    • "visibilità" proprietà.

Seguiamo ciascuno degli approcci uno per uno!

Approccio 1: Cancella attributo IMG SRC in JavaScript usando il metodo RemoveAttribute ()

IL "removeattribute ()"Il metodo rimuove l'attributo da un elemento. Questo metodo può essere utilizzato per cancellare un attributo particolare con conseguente rimozione dell'immagine specificata al tasto pulsante.

Sintassi

elemento.removeattribute (nome)


Nella sintassi data:

    • "nome"Si riferisce al nome dell'attributo.

Esempio

Seguiamo l'esempio di seguito:









Nel frammento di codice sopra:

    • Specificare l'immagine dichiarata con specifica "id" e il "src"Attributo.
    • Inoltre, crea un pulsante con un allegato "al clic"Evento che invoca la funzione clearAttribute ().
    • Nel codice JavaScript, definisce una funzione denominata "clearAttribute ()".
    • Nella sua definizione, accedi all'immagine inclusa tramite "id" usando il "getElementById ()" metodo.
    • Infine, applica il "removeattribute ()Metodo "per rimuovere il"src"Attributo, che comporterà la cancellazione dell'immagine al clic del pulsante.

Produzione


L'output sopra indica che l'immagine specificata in "src"L'attributo si cancella al clic del pulsante.

Approccio 2: Cancella attributo IMG SRC in JavaScript usando la proprietà Visualizza

IL "Schermo"La proprietà restituisce il tipo di visualizzazione dell'elemento associato. Questa proprietà può essere utilizzata per assegnare un valore all'elemento corrispondente in modo tale che l'attributo contenuto sia cancellato al clic del pulsante.

Sintassi

oggetto.stile.Display = Value


Nella sintassi data:

    • "valore"Si riferisce al valore assegnato alla proprietà di visualizzazione.

Esempio

Panoramiamo il seguente esempio:









Nelle righe di codice sopra, implementa i seguenti passaggi:

    • Ricordiamo gli approcci per includere un'immagine tramite "src"Attributo e creazione di un pulsante con un"al clic"Evento.
    • Nel codice JavaScript, definisci la funzione "clearAttribute ()".
    • Nella sua definizione, allo stesso modo, accedi all'immagine inclusa usando "getElementById ()" metodo.
    • Infine, assegnare il valore "nessuno"Alla proprietà del display. Ciò comporterà la cancellazione dell'immagine specificata in "src"Attributo.

Produzione


L'output sopra indica che si ottiene la funzionalità desiderata.

Approccio 3: Clear IMG SRC Attributo in JavaScript usando la proprietà visibilità

IL "visibilità"La proprietà assegna il valore in modo tale che un elemento diventi visibile o no. Questa proprietà può essere implementata per nascondere l'elemento associato, disabilitando così l'immagine specificata in "src"Attributo all'interno dell'elemento.

Sintassi

oggetto.stile.visibilità = valore


Nella sintassi sopra data:

    • "valore"Indica il valore assegnato all'elemento associato.

Esempio

L'esempio seguente illustra il concetto dichiarato:









Nelle righe di codice sopra:

    • Allo stesso modo, specificare l'immagine dichiarata con il specificato "id" e il "src"Attributo.
    • Inoltre, associare un "al clic"Evento con il pulsante creato reindirizzamento alla funzione clearAttribute ().
    • Nella parte JavaScript del codice, definisci una funzione denominata "clearAttribute ()".
    • Qui, allo stesso modo, accedi all'immagine inclusa usando "getElementById ()" metodo.
    • Infine, assegna il valore "nascosto"All'elemento associato, io.e., Immagine.
    • Ciò nasconderà di conseguenza l'immagine specificata in "src"Attributo, cancellando così il clic del pulsante.

Produzione


L'immagine specificata viene cancellata da DOM sul clic del pulsante, cancellando così "src"Attributo.

Conclusione

IL "removeattribute ()Metodo ", il"Schermo"Proprietà o"visibilità"La proprietà può essere applicata per cancellare l'attributo IMG SRC usando JavaScript. Il metodo RemoveAttribute () può essere utilizzato per rimuovere il "src"Attributo che si tradurrà nella cancellazione anche dell'immagine specificata. La proprietà del display nasconde il display eliminando così l'immagine sul clic del pulsante. La proprietà di visibilità nasconde l'elemento associato con conseguente cancellazione del contenuto "src"Attributo anche. Questo blog è guidato per cancellare l'attributo IMG SRC in JavaScript.