参考资料：菜鸟教程
JQuery HTML
===
JQuery除了可以对HTML内容进行修改之外，还能进行添加删除。
添加元素
$("p").append("aa") - 在被选元素的结尾插入内容
$("p").prepend() - 在被选元素的开头插入内容
注意上下这俩个的区别
$("p").after() - 在被选元素之后插入内容
$("p").before() - 在被选元素之前插入内容
这四个方法都可以接收无限数量的新元素
$("p").append("aa",''bb","cc");
append与after方法的不同
append方法在被选元素的结尾添加文本text1，text1还是属于该元素内。
after方法在被选元素之后添加文本text1，text1不属于该元素了。
比如：
<ol>
<li>List item 1</li>
<li>List item 2</li>
</ol>
$("ol").append("<li>追加列表项</li>");
$("ol").after("<li>追加列表项</li>");
结果就是（感受一下两者的不同）
1.List item 1
2.List item 2
3.追加列表项
- 追加列表项
使用append时要注意：由于添加的元素属于被选元素，所以添加的内容要与被选相符。比如在 $("img").append("< p>无法添加</ p>") ;是无法加入的，因为text与img不一致。
删除元素
$("#div1").remove();删除被选元素（及其子元素）
$("#div1").empty();删除被选元素的子元素
$("p").remove(".italic");删除class="italic" 的所有 <p> 元素，
remove的参数可以是任何 jQuery 选择器的语法。
添加删除CSS类
$("h1,h2,p").addClass("class1 class2") - 向被选元素添加一个或多个类
removeClass() - 从被选元素删除一个或多个类
toggleClass() - 对被选元素进行添加/删除类的切换操作
获取并设置CSS样式
$("p").css("background-color");返回首个匹配元素的 background-color 值
$("p").css("background-color","yellow");为所有匹配元素设置background-color 值
$("p").css({"background-color":"yellow","font-size":"200%"});同时设置多个样式
处理窗口尺寸
<img src="http://www.runoob.com/images/img_jquerydim.gif">
在上面这张图中的八个尺寸都可以获取和设置
就拿width来说（其他都一样，就是名称换了）
txt=$("#div1").width();获取该尺寸
$("#div1").width("300px");设置该元素的尺寸
JQuery 遍历
在使用它的方法之前首先知道什么叫遍历以及它的使用方法。以及掌握DOM文档树。
遍历用于根据其相对于其他元素的关系来"查找"（或选取）HTML 元素
就是通过某一项开始，选择向上移动（祖先），向下移动（子孙），水平移动（同胞）的方式来找到想要的元素。
祖先（向上移动）
$("span").parent();返回每个 <span> 元素的的直接父元素（只在上一级遍历）
$("span").parents();返回所有 <span> 元素的所有祖先（谁叫它是复数呢）
$("span").parents("ul");返回所有 <span> 元素的所有祖先，并且它是 <ul> 元素
$("span").parentsUntil("div");返回介于 <span> 与 <div> 元素之间的所有祖先元素
后代（向下移动）
$("div").children();返回每个 <div> 元素的所有直接子元素,可以使用可
选参数来过滤对子元素的搜索
$("div").children("p.1");返回类名为 "1" 的所有 <p> 元素
$("div").children("p#a");返回id为 "1" 的所有 <p> 元素
$("div").find("*");返回被选元素的所有后代元素，一路向下直到最后一个后代
$("div").find("span");返回属于 <div> 后代的所有 <span> 元素
同胞（左右移动）
$("h2").siblings("p");返回 <h2> 的所有<p> 元素，如果不加参数则是所有元素
$("h2").next();返回 <h2> 的下一个同胞元素
$("h2").nextAll();返回 <h2> 的所有跟随的同胞元素
$("h2").nextUntil("h6");返回介于 <h2> 与 <h6> 元素之间的所有同胞元素
prev(), prevAll() & prevUntil()方法与上面相同只是方向相反。