Home >Common Problem >How to remove element content with jquery animation
Jquery animation method to remove element content: 1. Use the "children()" method to return all child elements of the selected element, and then use the "remove()" method to delete the selected element and child elements. The syntax is " $(element).children().remove();"; 2. Use the "empty()" method to delete the child elements of the selected element. The syntax is "$(child element).empty();".
Operating system for this tutorial: Windows 10 system, jQuery3.6.0 version, Dell G3 computer.
Two methods for jquery animation to remove element content:
1. Use the children() method to return all direct child elements of the selected element, and then use jQuery remove( ) method deletes the selected element and its child elements.
The code is as follows:
<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script><script>$(document).ready(function(){ $("button").click(function(){ $("#div1").children().remove(); });});
</script>
</head>
<body>
<div id="div1" style="height:120px;width:300px;border:1px solid black;background-color:yellow;">
<p>This is some text in the div.</p>
<p>This is a paragraph in the div.</p>
<p>This is another paragraph in the div.</p>
</div>
<br>
<button>删除 div 元素</button
></body>
</html>Open the html file with a browser, click the delete button, and clear the content in the div element.
#2. The jQuery empty() method deletes the child elements of the selected element.
The code is as follows:
<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){ $("button").click(function(){ $("#div1").empty(); });});
</script>
</head>
<body>
<div id="div1" style="height:100px;width:300px;border:1px solid black;background-color:yellow;">This is some text in the div.
<p>This is a paragraph in the div.</p>
<p>This is another paragraph in the div.</p>
</div>
<br>
<button>清空 div 元素</button>
</body>
</html>Open the html file with a browser, click the delete button, and clear the content in the div element.
The above is the detailed content of How to remove element content with jquery animation. For more information, please follow other related articles on the PHP Chinese website!