Cómo eliminar el elemento HTML de DOM usando jQuery

Cómo eliminar el elemento HTML de DOM usando jQuery

En la programación web, los desarrolladores a menudo enfrentan situaciones en las que se requiere eliminar todo el elemento HTML o solo los elementos anidados dentro de un elemento especificado. Para lograr estas tareas con gran facilidad, hay ciertos métodos jQuery disponibles, como eliminar () y vacío (). Este artículo lo guiará sobre cómo usar estos métodos para eliminar un elemento HTML con la ayuda de ejemplos relevantes.

Eliminar un elemento HTML usando jQuery

Aplicar los métodos mencionados a continuación para eliminar elementos en jQuery.

  1. eliminar()
  2. vacío()

Aquí hemos discutido los métodos mencionados anteriormente en profundidad.

método eliminar ()

Este método elimina un elemento HTML y todo dentro de él, que incluye cualquier contenido o elemento anidado dentro del elemento especificado.

Ejemplo

Supongamos que desea eliminar un elemento que incluye todos los elementos anidados presentes dentro de él utilizando el método remove (). Use el siguiente código.

Html


Algún párrafo




En el código HTML anterior, hemos creado un, y en el interior, hemos anidado un

elemento. Además, también hemos creado un botón que eliminará el elemento.

jQuery

$ (documento).Ready (function ()
ps.botón 1").hacer clic (function ()
ps.div ").eliminar();
);
);

Ahora hemos aplicado el método remove () que eliminará todo y todos sus elementos infantiles.

Producción


El método remove () ha eliminado con éxito todo el DIV.

método vacío ()

El método vacía () también se usa para eliminar elementos, sin embargo, este método solo elimina el contenido o los elementos anidados dentro del elemento especificado.

Ejemplo

Para demostrar el funcionamiento del método vacía (), estamos utilizando el ejemplo anterior, pero ahora, en lugar de aplicar el método remover (), aplicaremos el método vacía ().

jQuery

$ (documento).Ready (function ()
ps.botón 1").hacer clic (function ()
ps.div ").vacío();
);
);

En el código anterior, se utiliza el método vacía () que eliminará solo el contenido o elementos anidados dentro del divs.

Producción

Los elementos anidados dentro del div se han eliminado con éxito.

Conclusión

Los elementos HTML se pueden eliminar utilizando los dos métodos proporcionados por jQuery que son; eliminar () y vacío (). El método remove () elimina un elemento HTML y todo lo que incluye cualquier contenido o elemento anidado dentro del elemento especificado, mientras tanto, el método vacía () solo elimina el contenido o los elementos anidados dentro del elemento especificado. Estos métodos se destacan en detalle en esta guía, junto con ejemplos relevantes.