Use a comparison table to explain the differences between several methods
Method name |
Parameters |
The event bound to the removed element and Whether the data is also removed |
Whether the element itself is removed |
empty |
无 |
##是 |
No |
| ##remove
| ##SelectorExpressionclass
remove(“tag”):
| Yes||
##The parameters are the same as remove |
No |
The situation is the same as remove |
The code is as follows:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript" src="jquery-1.11.0.js" ></script>
<script type="text/javascript">
$(function() {
var $p2=$("#p2");
$p2.data("value", 1);
$("#detach").on("click", function() {
$p2.detach();
});
$("#back").on("click", function() {
$("#p1").append($p2);
console.log($("#p2").data("value"));
});
});
</script>
</head>
<body>
<p id="p1">
<p id="p2">
p2
</p>
<p id="p3">
p3
</p>
</p>
<input value="detach" id="detach" type="button" />
<input value="back" id="back" type="button" />
</body>
</html>directly The running results are as follows:
## Click detach and the running results are as follows: 
##Click back to run the result as shown below:
#If you change detach to remove, then after clicking back, the console will display undefined. 
The above is the detailed content of jQuery interpretation of the difference between empty, remove and detach. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
