jQuery after() 和 insertafter()

最新推荐文章于 2024-07-21 02:50:13 发布

梦忆长安

最新推荐文章于 2024-07-21 02:50:13 发布

阅读量215

点赞数

本文链接：https://blog.csdn.net/qq_44971038/article/details/103304684

版权

两种方法均是在指定标签之后添加新的标签，和append()显示的效果很接近，append()是标签内末尾添加；这两种是标签外后面添加；

after()

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="js/jquery-3.3.1.js"></script>
	</head>
	<body>
		<span id="love">I Love</span>
		
		<script>
			$("#love").after("<i> You</i>");
		</script>
	</body>
</html>

显示的效果如下；

查看格式我们会发现 "<i> You</i> 不是在 <span id="love">I Love</span> 标签内部的后面，而是外部的后面，这是和append()方法的区别；

insertAfter()

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="js/jquery-3.3.1.js"></script>
	</head>
	<body>
		<span id="love">I Love</span>
		<i id=" you"> You</i>
		<script>
			$("#you").insertAfter("#love");
		</script>
	</body>
</html>

insertAfter() 方法是将已经存在的标签移位到指定标签之后（也是外部），上面代码效果如下；