很久没有jquery写东西了，最近使用jquery的时候发现很多节点的操作都不太熟悉了，于是就进行了一个小小的总结。
创建节点：var dom=$('<div></div>');
添加节点：
添加节点的方法不仅可以创建新节点进行添加，还可以实现节点的移动。
- 添加子节点
(1) 在父级元素的末尾追加 append() /appendTo()
例如：向div中添加p节点
$('div').append('p'); / $('p').appedTo('div');
(2) 在父级元素的开始位置追加 prepend/prependTo
用法与 append /appendTo相同，区别就在于向父级元素添加时的位值不同。
- 添加同级节点
(1) after() /before() :在匹配元素之后／前插入节点。
例如：<p class="p1"></p>
$('.p1').after('<p>我是新来的</p>'); / $('.p1').before('<p>我是新来的</p>');
<p class="p1"></p><p>我是新来的</p> / <p>我是新来的</p><p class="p1"></p>
(2) insertAfter() /insertBefore() :将匹配的元素插入到指定元素的后面／前面。
与after/before作用相同，写法位置刚好相反
例如：<p class="p1"></p>
$('<p>我是新来的</p>').insertAfter('.p1'); / /<p class="p1"></p><p>我是新来的</p>
$('<p>我是新来的</p>').insertBefore('.p1');/ <p>我是新来的</p><p class="p1"></p>
删除节点: $('.p1).remove()
查找节点：
- 查找父节点
parent(expr)/parents(expr) :expr为查询条件，可以选填，根据条件查询
parent是找到父节点。parents是找到所有的祖先元素
- 查找子节点
(1) childern(expr) :找到满足表达式的一级子节点。
(2) contents() :找到此节点下的所有内容，包括节点、文本
- 查找同级节点
(1) prev()/ next() :查找上一个/下一个相邻的兄弟节点。
(2) prevAll() /nextAll() :查找之前/之后的所有兄弟节点。
(3) siblings() :查找与之前后相邻的兄弟节点。
- 利用选择器查找节点
<p>0</p>
<p class="p1">1</p>
<div>
<p>2</p>
</div>
<p>3</p>
(1) 查找所有子孙节点 $('A B')
(2) 查找一级子节点 $('A>B')
(3) 查找位于之后的兄弟节点,包括兄弟节点中满足条件的节点 $('A+B') // <p>2</p> <p>3</p>
(4) 查找位于之后的兄弟节点，不在兄弟节点的子节点中查找 $('A~B') //<p>3</p>
- 查找第一个/最后一个节点
(1) $("li").first() / $('li').last()
(2) $('li:first'); /$('li:last')
- 查找第一个子节点
(1) $('.par').children('div').get(0) 得到class为.par下的第一个子div元素，为一个dom对象。
(2) $('.par).children(':first') 得到class为.par下的第一个子元素
- 查找第n个节点
$('li:eq(n)') n从0开始。
复制节点
$(this).clone(true).appendTo("ul");
clone()实现节点的复制，默认不复制绑定的事件，如果需要给复制元素的时候也同时复制这个元素身上的事件，需要增加一个参数true。
替换节点
//replaceWith()使用with后面的标签替换匹配的元素
$("p").click(function(){
$("p").replaceWith("<span>这是一个span</span>")
})
hover函数实现样式切换 ：
$("p").hover(function(){
$("p").css("background-color","yellow");
},function(){
$("p").css("background-color","pink");
});
移除hover事件，要分别移除mouseover和mouseout事件