jQuery为元素插入内容或追加内容

append、appendTo、prepend、prependTo、after、insertafter、before的区别:

append、appendTo、after、insertafter是将内容追加到后面,append、appendTo追加到原来元素内容最后,after、insertafter追加到原来元素之外。appendTo、prepend、before同理。具体看代码:

<!DOCTYPE html>
<html>
<head>
	<title>insertAfter</title>
	<script src="jquery.js"></script>
	<script type="text/javascript">
			$(document).ready(function(){
				$("button").click(function(){
					$("<h1>cha-ru-ed</h1>").insertAfter(".inner");
					$(".inner").after("<p>cha-ru-ed</p>");
					$(".inner").append("<p>cha-ru-ed</p>");
					$("<p>cha-ru-ed</p>").appendTo(".inner");
					$(".inner").before("<p>cha-ru-ed</p>");
					$(".inner").prepend("<p>cha-ru-ed</p>");
					$("<p>cha-ru-ed</p>").prependTo(".inner");
				});
			});
	</script>
</head>
<body>
<p class="inner">yuanlai</p>
<button>cha-ru</button>
</body>
</html>

猜你喜欢

转载自blog.csdn.net/weixin_42565135/article/details/85304679