首先分清jQuery对象和DOM对象，这两者可相互转化，如：
var $cr=$("#cr"); //jquery对象
var cr=$cr[0] ; //DOM对象
var cr=$cr.get(0); //DOM对象
var cr=document.getElementById("cr"); //DOM对象
var $cr=$(cr); //jquery对象
jquery选择器：
1.无论元素是否存在，$("xx")都都是一个对象，因此判断语句应这样写：
if ($("xx").length>0) {
}
2.
基本选择器：
$("#id") $(".class") $("*") $("div,span,p.myclass")
层次选择器：
$("div span") 后代元素范围大，只要是后代都满足
$("div>span") 子元素范围小，只能是一级子元素才被选中
过滤选择器：
$("div:first") 格式以：开头
内容过滤选择器：
$("div:contains(text)") 同样以：开头，但以内容作为过滤依据
可见性过滤选择器：
属性过滤选择器：
子元素过滤选择器：
表单属性过滤选择器：
exa
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>example for html5</title> <script src="jquery.js" type="text/javascript"></script> </head> <body> <div class="subcategorybox"> <ul> <li><a href=#>佳能</a></li> <li><a href=#>索尼</a></li> <li><a href=#>三星</a></li> <li><a href=#>尼康</a></li> <li><a href=#>松下</a></li> <li><a href=#>卡西欧</a></li> <li><a href=#>富士</a></li> <li><a href=#>柯达</a></li> <li><a href=#>宾得</a></li> <li><a href=#>理光</a></li> <li><a href=#>奥林巴斯</a></li> <li><a href=#>明基</a></li> <li><a href=#>爱国者</a></li> <li><a href=#>其他</a></li> </ul> </div> <div class="showmore"> <a href=# onclick="return false"><span>显示其他品牌</span></a> </div> <script type="text/javascript"> $(document).ready(function(){ $("div li:gt(6):not(last)").hide(); $(".showmore>a").click(
function(){ if ($("li:hidden").length>0) { $(".showmore>a").html("精简显示品牌"); $("li:hidden").show();} else { $(".showmore>a").html("显示其他品牌"); $("div li:gt(6):not(:last)").hide(); } }); }); </script> </body> </html>