JQ操作页面元素 append insertAfter

最新推荐文章于 2024-02-24 21:10:48 发布

快乐的小毛毛虫

最新推荐文章于 2024-02-24 21:10:48 发布

阅读量101

点赞数

分类专栏：前端文章标签： jquery html html5

本文链接：https://blog.csdn.net/qq_45689826/article/details/120082113

版权

前端专栏收录该内容

16 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			#div1{
				height:200px;
				weight:300px;
				border: 11px solid red;
			}
			p{
				border:1px solid green;
			}
		</style>
		<script src = "./jquery.js"></script>
		<script>
			$(function(){
				//创建新的元素
				var p = $("<p>hhhh000000</p>");
				
				//------------------增加子元素在现有的元素之后
				
				// $("#div1").append(p);
				// p.appendTo("#div1");
				
				//增加子元素在现有的元素之前
				// $("#div1").prepend(p);
				// p.prependTo("#div1");
				
				//平级添加元素--------现有元素之前
				// $("#div1").before(p);
				// p.insertBefore("#div1");
				
				//平级添加元素--------现有元素之后
				// $("#div1").after(p);
				p.insertAfter("#div1");
			})
		</script>
	</head>
	<body>
		<div id ="div1">
			<p>hhh1</p>
			<p>hhh12</p>
			<p>hhh13</p>
			<p>hhh14</p>
		</div>
	</body>
</html>

快乐的小毛毛虫

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQ操作页面元素 append insertAfter

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> #div1{ height:200px; weight:300px; border: 11px solid red; } p{ border:1px solid green; } </styl.
复制链接

扫一扫