1949啦网--小小 痛苦,是因为能力和欲望不匹配造成的

jquery节点操作

1、节点操作

<!DOCTYPE html>      <html>      	<head>      		<meta charset="UTF-8">      		<title></title>      		<style type="text/css">      			#hd{      				width: 600px;      				height: 500px;      				border: 2px solid blue;      			}      		</style>      		<script src="jquery-1.11.3.min.js.js" type="text/javascript"></script>      		<script type="text/javascript">      			$(function(){      				$('#dd').click(function(){      //				创建一个新的h2标签      //				在jquery中创建新标签只需要将标签最终的代码写成字符串形式即可      //				var newH = '<h2 class="hd">我是新来的!</h2>';      ////				将新创建的标签追加到box里  append:添加,在#box里面一堆h2标签后面加      //				$('#box').append(newH);      //				(第1种写法)把#aa追加进#box里面的最后      //				$('#box').append($("#aa"));      //				(第2种写法)	将#aa加进#box里面的最后      //				$('#aa').appendTo($("#box"));      ////				从头部追加      //				$("#box").prepend($('#aa'));      ////				prependTo也是从头部追加 反过来写      //				$("#aa").prependTo($('#box'));      //				        //				插队:中间插入			        //				after:后面  在eq(1)后面插入      //				$("#box h2").eq(1).after($("#aa"));      ////				插队:中间插入反过来写法和上面的效果一样的      //				$("#aa").insertAfter($("#box h2").eq(1));      //				插队:中间插入      //				before:前面   在eq(1)前面插入      //				$("#box h2").eq(1).before($("#aa"));      //				和上面的一样,位置倒过来写      				$("#aa").insertBefore($("#box h2").eq(1));      				})      			})      		</script>      	</head>      	<body>      		<h1 id="aa">这个是h1标签</h1>      		<input type="button" name="" id="dd" value="来点我呀" />      		<br /><br />      		<div id="box">      		<h2>如果你是工作经验小于2年的朋友0</h2>      		<h2>如果你是工作经验小于2年的朋友1</h2>      		<h2>如果你是工作经验小于2年的朋友2</h2>      		<h2>如果你是工作经验小于2年的朋友3</h2>      		<h2>如果你是工作经验小于2年的朋友4</h2>      		<h2>如果你是工作经验小于2年的朋友5</h2>      		<h2>如果你是工作经验小于2年的朋友6</h2>      		</div>      	</body>      </html>

上面代码效果图片

原文链接:https://www.qiquanji.com/post/7662.html

本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。

微信扫码关注

更新实时通知

作者:xialibing 分类:网页教程 浏览: