<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery-3.2.1.js"></script>
</head>
<body>
<div id="div1">hello div1</div>
<p id="p1">hello p1</p>
<div>hello div2
<p id="p2">hello p2</p>
</div>
<script>
var ele=$("#p2");
//$("#div1").append(ele); //把p2插入到div1的子代最后
//$("#p1").appendTo(ele); //把p1插入到p2子代最后
//("#p1").prepend(ele); // 把p2插入到p1子代里的第一个后位置
//$(ele).prependTo($("#p1")); //把p2插入到P1子代里的第一个位置
//$("#p1").after(ele); //把p2加入到p1后面的同级兄弟标签中去
//$(ele).insertAfter("#p1"); //把p2加入到p1后面的同级兄弟标签中去
//$("#div1").before(ele); //把p2加入到div1前面的同级兄弟标签中去
//$(ele).insertBefore("#div1"); //把p2加入到div1前面的同级兄弟标签中去
</script>
</body>
</html>
注:以上4对方法是实现标签兄弟父子关系之间的位置移动,或者在在参数那直接加入文本 成为添加文本的方式.
每队的方法效果相同,只是一个是表达式在前,一个是参数在前.实现4中方法