Come rimuovere l'elemento HTML da DOM usando jQuery

Nella programmazione web gli sviluppatori affrontano spesso situazioni in cui è necessario rimuovere l'intero elemento HTML o solo gli elementi nidificati all'interno di un elemento specificato. Per svolgere questi compiti con grande facilità ci sono alcuni metodi jQuery disponibili come Rimuovi () e vuoto (). Questo articolo ti guiderà su come utilizzare questi metodi per rimuovere un elemento HTML con l'aiuto di esempi pertinenti.

Rimuovere un elemento HTML usando jQuery

Applicare i metodi di seguito per rimuovere gli elementi in jQuery.

1. rimuovere()
2. vuoto()

Qui abbiamo discusso in modo approfondito i metodi sopra menzionati.

Rimuovi () metodo

Questo metodo rimuove un elemento HTML e tutto al suo interno, che include qualsiasi contenuto o elementi nidificati all'interno dell'elemento specificato.

Esempio

Supponiamo di voler rimuovere un elemento che include tutti gli elementi nidificati presenti al suo interno usando il metodo Rimovi (). Usa il seguente codice.

Html

Qualche paragrafo

Rimuovere

Nel codice HTML sopra, abbiamo creato un e all'interno di quello che abbiamo nidificato a

elemento. Inoltre, abbiamo anche creato un pulsante che rimuoverà l'elemento.

jQuery

$ (documento).ready (function ()
$ (".Button1 ").Click (function ()
$ (".Div ").rimuovere();
);
);

Ora abbiamo applicato il metodo Rimovi () che rimuoverà l'intero e tutti i suoi elementi figlio.

Produzione

Il metodo Rimovi () ha rimosso correttamente l'intero div.

Metodo vuoto ()

Il metodo vuoto () viene anche utilizzato per la rimozione degli elementi, tuttavia questo metodo rimuove solo il contenuto o gli elementi nidificati all'interno dell'elemento specificato.

Esempio

Per dimostrare il funzionamento del metodo vuoto (), stiamo usando l'esempio sopra ma ora invece di applicare il metodo Rimovi () applicheremo il metodo vuoto ().

jQuery

$ (documento).ready (function ()
$ (".Button1 ").Click (function ()
$ (".Div ").vuoto();
);
);

Nel codice sopra, viene utilizzato il metodo vuoto () che rimuoverà solo il contenuto o gli elementi nidificati all'interno del div.

Produzione

Gli elementi nidificati all'interno del div sono stati rimossi con successo.

Conclusione

Gli elementi HTML possono essere rimossi utilizzando i due metodi forniti da jQuery che sono; Rimuovi () e vuoto (). Il metodo Rimozione () rimuove un elemento HTML e tutto al suo interno, che include qualsiasi contenuto o elementi nidificati all'interno dell'elemento specificato, nel frattempo, il metodo vuoto () rimuove solo il contenuto o gli elementi nidificati all'interno dell'elemento specificato. Questi metodi sono evidenziati in dettaglio in questa guida, insieme a esempi pertinenti.