最近做前端页面，频繁用到一些jQuery的选择器，所以特意来总结一下：
测试页面：
<html>
<head>
<script src="jquery-1.7.2.min.js"></script>
<script>
/*$(function() {
$(document).ready(function(){
var $obj = $("div[name='div'] a");
alert("the first: " + $obj.html());
});
});*/
</script>
<script>
</script>
</head>
<body>
<div name="parent">
<div name="div">
<c>ok</c>
<a>lala</a>
<b>Just Test</b>
<a class="d">hahha</a>
</div>
<div class="div2">wuwuwu</div>
</div>
</body>
</html>
jQuery的常用操作：
1.追加元素
1）向后追加：append appendTo after用法及区别（含demo测试）；
当取取示例中的var $obj = <a>lala</a>对象时，执行
append写法：$obj.append("<e>test</e>")
appendTo写法：$("<e>test</e>").appendTo($obj)后，
会出现<a>lala<e>test</e></a>（在<a></a>的内部）;
而当执行$obj.after("<e>test</e>")之后，会得到<a>lala</a><e>test</e>的结果——说明是当作兄弟节点追加的！
向前追加: prepend prependTo before（用法及区别同上）
2）查找父节点(parent(), parents())、子节点(children,find)、兄弟节点(prev,prevAll, next,nextAll)
parent()：查找当前节点的（直属）父节点；parents()查找当前节点的所有父节点(包含<html>对象)。
——当取示例中的<a>lala</a>对象时，他的parent().length的值为1，而parents().length的值为4(包括2个div，1个body，1个html);
——当取示例中的<a>lala</a>对象时，他的parent().html()的值为<c>ok</c><a>lala</a><b>Just Test</b><a class="d">hahha</a>，
而parents().html()的值为<c>ok</c><a>lala</a><b>Just Test</b><a class="d">hahha</a>;
children():查找当前节点的所有子节点（更多时候是用find方法）：
——当取示例中的<div name="parent"></div>对象时，他的children().html()的值为：<c>ok</c><a>lala</a><b>Just Test</b><a class="d">hahha</a>;
他的children().length的值为2(两个div)
children($selector)查找符合条件的子节点：
——当取示例中的<div name="parent"></div>对象时，他的children(".div2").html()的内容为wuwuwuwu，而尝试children(".d").html()则会得到null，因为
<a class="d">hahha</a>不是其“直接子节点”
“上、下一个”兄弟节点：
——当取示例中的<a>lala</a>对象时，他的prev().html()的值为ok, 他的next().html()的值为Just Test， 他的nextAll().html()的值也为Just Test，
他的nextAll().length的值为2, nextAll(".d").html()的值为haha（可以传递参数过滤，所以此时不支持nextAll().find($selector)的用法了哈。。prevAll($selector)也一样）；
3）jQuery name选择器["name='xxx'"] id/class选择器["id/class='yyy'"]与(".class") ("#id")等效 （因为name选择器没有对应的标识符，所以只能通过中括号的形式）
复合选择器 $("#app134 tr td.lefttop")——查找id为#app134的元素下的tr下的td并且td的class属性是lefttop,为了易读性，可以写成这样（这2中写法是等效的）：
$("#app134").find("tr td").find(".lefttop") $("#app134").find("tr td.lefttop")
-----------------------------------------
附：css相关
注：一般都是把style属性中的东西单独抽离出来写样式.class{....}，再引用class="xxx" 这样有利于解耦！
4）rowspan（跨行）、colspan(跨列)是td的属性，不是tr的（怪不得我之前一直把他当做tr的属性，不起作用）！
5）为避免窗口浏览器缩小造成div之间位置“错位”时，最好在body下套一个大的div,并且把这个起包围作用的div的width, height设置为合理的固定值。
6）th和td一样（同级），表示表头，字体会被自动加粗。一般写在第一行，也需要被tr包围。th可以在<thead><tr><th>title</th></tr></thead>里，也可以直接在<tbody><tr><th>title</th></tr></tbody>里。。注意不要搞混<thead>与<th>。。