jQuery操作dom相关的方法
1.添加节点
1）append()方法：会把创建的节点添加为其子节点，并且把子节点排在最后面
2）prepend()方法：会把创建的节点添加为其子节点，把这个节点排在最前面
3）after()方法：会把创建的节点当其兄弟节点，并且把创建的节点放在之后
4）before()方法：会把创建的节点当其兄弟节点，并且把创建的节点放在之前
<html>
<head>
<title></title>
</head>
<style>
*{
margin:0;
padding:0;
}
ul>li{
list-style:none;
}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
var $li=$('<li>新加的节点,作为子节点，放在子节点最后面</li>') //创建节点
$('ul').append($li) //会把$li节点放在子节点里的最后
var $li1=$('<li>新加的节点，作为子节点，放在子节点最前面</li>')
$('ul').prepend($li1) //会把$li1节点放在子节点里的最前
var $li2=$('<li>新加的节点，作为兄弟节点，放在ul后面</li>')
$('ul').after($li2)
var $li3=$('<li>新加的节点，作为兄弟节点，放在ul前面</li>')
$('ul').before($li3)
})
</script>
<body>
<ul>
<li>li1</li>
<li>li2</li>
<li>li3</li>
</ul>
</body>
</html>
效果图
2.删除节点
1）remove()方法：删除指定的元素，并且删除子元素及内容
2）empty()方法：删除指定元素内容，但不会删除指定的元素，会删除指定元素的子元素及内容
<html>
<head>
<title></title>
</head>
<style>
*{
margin:0;
padding:0;
}
ul>li{
list-style:none;
}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
$('ul').remove() //会把ul及内容删除，子元素及内容也删除
$('.father').empty() //father类这个div不会删除，但内容会删除，子元素及内容删除
})
</script>
<body>
<ul> ul
<li>li1</li>
<li>li2</li>
<li>li3</li>
</ul>
<div class="father">
我是div
<div>我是子div</div>
</div>
</body>
</html>
效果图
