JQuery removes and replaces DOM elements in several ways

  • 2020-03-30 03:02:17
  • OfStack

delete

The delete operation is as simple as chaining the remove() method after the result set.

For example, to delete all a elements in the following HTML script, go directly through
 
$('a'.remove(); 

We can do that.
 
<h3>Anchors</h3> 
<a href="#" class="remove">Anchor Element</a> 
<a href="#">Anchor Element</a> 
<a href="#" class="remove">Anchor Element</a> 


Of course, you can also filter the selection results by passing arguments to remove and then perform the remove operation.
 
$('a').remove('.remove'); 

Here's the thing to note

The remove operation does not remove qualified elements from the result set, so it is theoretically possible to continue with the removed element
Remove operation will not only "delete" element is associated with all elements of the data will be deleted (event handlers, internally cached data)

replace

If you want to replace the li element that class is removed with < Li> Removed< / li> , you can use the following two equivalent methods
 
$('li.remove').replaceWith('<li>removed</li>); 
$('<li>removed</li>;).replaceAll('li.remove'); 

Related articles: