How to remove element content with jquery animation-Common Problem-php.cn

How to remove element content with jquery animation

尊渡假赌尊渡假赌尊渡假赌

Release： 2023-05-29 10:16:19

Original

1141 people have browsed it

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();".

How to remove element content with jquery animation

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>

Copy after login

Open the html file with a browser, click the delete button, and clear the content in the div element.

屏幕截图 2023-05-29 091949.png

#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>

Copy after login

Open the html file with a browser, click the delete button, and clear the content in the div element.

屏幕截图 2023-05-29 092249.png

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!