<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Dom操作</title>
<script type="text/javascript" src="../jquery-3.2.1.min.js"></script>
<!--
jquery中的DOM方法
insertBefore():A.insertBefore(B),將A移動添加在B的前面，A並不是複製，而是剪切移動
before()
insertAfter():與上述相反,原生JS中沒有
after()
appendTo():在被選元素的開頭（仍位於內部）插入指定內容,類似原生中的appendChild();
append()
prependTo():在被選元素的開頭（仍位於內部）插入指定內容
prepend()
brfore():A.before(B).A的前面必須是B
remove():刪除節點
兩者的關係：是後續操作有所不同；
insertBefore()
brfore()它後續的操作始終作用在A 的身上
-->
<script type="text/javascript">
$(function(){
$('span').insertBefore($('div'));//將span標籤添加到div標籤的前面
$('span').insertAfter($('div'));
$('div').appendTo($('span'));
$('div').prependTo($('span'));
})
</script>
</head>
<body>
<div>div</div>
<span>span</span>
</body>
</html>
