jQuery解读之empty、remove、detach区别

巴扎黑
Lepaskan: 2017-06-25 09:53:23
asal
1404 orang telah melayarinya

        通过一张对比表来解释几个方法之间的不同

方法名

参数

被移除的元素所绑定的事件及数据是否也被移除

元素自身是否被移除

empty

remove

选择器表达式,比如

remove(“.class”);

remove(“#id”);

remove(“tag”):

是(无参数时),有参数时要根据参数所涉及的范围。

detach

参数同remove

情况同remove

       下面着重就detach不移除元素绑定的事件及数据这一特性来举个例子。

代码如下:

<!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>
Salin selepas log masuk


直接运行结果如下:


点击detach运行结果如下:



点击back运行结果如图:


如果将detach改为remove,那么点击back之后,控制台显示为undefined。

Atas ialah kandungan terperinci jQuery解读之empty、remove、detach区别. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan