Come rimuovere l'elemento mediante ID usando JavaScript

Come rimuovere l'elemento mediante ID usando JavaScript
Esistono diverse funzionalità che JavaScript fornisce a un sito Web per renderlo interattivo. Una delle caratteristiche più elementari fornite da JavaScript è quella di rimuovere un nodo o un elemento da una pagina web.

Questo articolo seguirà i passaggi indicati di seguito per la rimozione di un elemento da una pagina Web in JavaScript.

  • Metodo getElementsbyid
  • Rimuovi () metodo
  • Rimozione di nodi o elementi per bambini

Qual è il metodo getElementsbyid?

getelementsbyid, come suggerisce il nome, è un metodo JavaScript che viene utilizzato per recuperare un ID specifico di un elemento e restituirlo a una variabile. Questo valore dell'elemento restituito può essere utilizzato nell'esecuzione di varie attività.

Sintassi

Successivamente, daremo un'occhiata al metodo Rimovi () integrato per scoprire come può essere utilizzato per rimuovere elementi mediante ID in JavaScript.

Il metodo Rimovi () in JavaScript

Il metodo Rimovi () in JavaScript aiuta a rimuovere un elemento o un nodo. Non richiede parametri o restituisce alcun valore.

Come abbiamo visto lo scopo di entrambi i gethelementsbyid metodo e il rimuovere metodo. Ora daremo un'occhiata a un semplice frammento di codice che eliminerà un elemento HTML da una pagina Web:

Html



Rimuovere il testo


Questo testo verrà rimosso quando si fa clic sul pulsante




Nel frammento di codice sopra, viene fornito un semplice testo in

E

Tag elemento HTML insieme a un pulsante. Una volta fatto clic sul pulsante, il testo all'interno del

Il tag verrà rimosso dalla pagina web.

Salva ed esegui il codice, l'output dello snippet sopra è simile a quello mostrato di seguito.

Ora, un codice JavaScript dovrebbe essere aggiunto dietro il pulsante in modo che quando il pulsante viene cliccato, i risultati desiderati possono essere raggiunti.

Js

Nello script sopra, si può vedere che un definito dall'utente myremovefunction è stata creata la funzione in cui in primo luogo il Id dell'elemento viene recuperato dal getelementbyid metodo ed è memorizzato nella variabile Textremove.

Dopo aver restituito l'elemento per ID alla variabile Textremove, la funzione integrata di rimuovere è stato utilizzato che rimuoverà l'elemento html nel momento in cui viene cliccato il pulsante.

Durante l'esecuzione del codice sopra, un output simile può essere visto sul browser come presentato di seguito.

Nell'istantanea sopra dell'uscita, si può vedere che, quando si fa clic sul pulsante, il testo che era presente nel

L'elemento tag è stato rimosso dalla pagina web.

Conclusione

JavaScript fornisce metodi diversi per una migliore funzionalità della pagina web. GetElementByID è uno dei metodi comuni e utili che restituisce il valore ID di un elemento. L'elemento il cui ID è salvato su una variabile può essere rimosso utilizzando la funzione di rimozione integrata di JavaScript.