$("body div").css("background", "#ffbbaa");//body中所有的div，（包括子节点，孙节点...）
        $("body>div").css("background", "#ffaabb");//body的所有div子节点
        $("#one+div").css("background", "#ffbbaa");//id为one的下一个相邻div兄弟节点
        $("#two~div").css("background", "#ffaabb");//id为two的节点之后的所有的div节点
        $("#two").siblings("div").css("background", "#ffaabb");//id为two的所有兄弟div节点
        $("#two").nextAll("span:first").css("background", "#ffaabb");//id为two的的节点之后的TagName为span的第一个同辈节点
        $("#two").prevAll("div").css("background", "#ffaabb");//选择id为two的所有在其前面的div兄弟节点（只包括兄弟）                

        //css("background", "#ffaabb");方法是jQuery对象才有的$("div:first")    TagName为div的第一个节点$("div:last")    TagName为div的最后一个节点$("div:not(.one)")    TagName为div的且class不为one的节点数组$("div:even")    TagName为div的且下标为偶数的节点数组$("div:odd")    TagName为div的且下标为奇数的节点数组$("div:gt(3)")    TagName为div的且下标大于3的节点$("div:eq(3)")    TagName为div的且下标等于3的节点$("div:lt(3)")    TagName为div的且下标小于3的节点$(":header")    所有标题节点<h1></h1>...$(":animated")    所有在执行动画的节点$("#two").nextAll("span:first")    id为two的节点之后第一个TagName为span的节点

        //选择 含有文本 'di' 的 div 元素$("div:contains('di')")//选择的div元素没有子元素$("div:empty")//选择的div元素包含有class为mini的子元素$("div:has(.mini)")//选择的div元素含有子元素$("div:parent")

选取含有 属性title 的div元素.                    $("div[title]")选取 属性title值等于'test'的div元素.            $("div[title='test']")选取 属性title值不等于'test'的div元素(没有属性title的也将被选中).        $("div[title!='test']")选取 属性title值 以'te'开始 的div元素.            $("div[title^='te']")"选取 属性title值 以'est'结束 的div元素.        $("div[title$='est']")

选取 属性title值 含有'es'的div元素.            $("div[title*='es']")组合属性选择器,首先选取有属性id的div元素，然后在结果中 选取属性title值 含有'es'的 div 元素.        $("div[id][title*='es']")选取 含有 title 属性值, 且title 属性值不等于 test 的 div 元素.        $("div[title][title!='test']")

选取每个class为one的div父元素下的第2个子元素.                        $("div.one :nth-child(2)")
$("div.one :nth-child(index)");//选取class为one的div下第index个子元素，index从1开始
$("div.one :nth-child(even/odd)");//能选取每个父元素下的索引值为偶/奇数的元素。(:nth-child(even/odd)的索引值是从1开始)　　　　　　　　　　　　　　　　　　　 //与$("div.one :even/odd");选择的奇偶恰恰相反　　　　　　　　　　　　　　　　　　　 //（注意！！！！！！！！！！！因为:even/odd的索引值是从0开始，这里0也是偶数）

:nth-child(3n): 能选取每个父元素下的索引值是 3 的倍数 的元素 :nth-child(3n + 1): 能选取每个父元素下的索引值是 3n + 1的元素 选取每个class为one的div父元素下的第一个子元素. $("div.one :first-child") 选取每个class为one的div父元素下的最后一个子元素. $("div.one :last-child") 如果class为one的div父元素下的仅仅只有一个子元素，那么选中这个子元素. $("div.one :only-child")

对表单内 可用input 赋值操作.            $(":input:enabled").val("姬云飞");//使所有可用的input的value属性值为“姬云飞”对表单内 不可用input 赋值操作.        $(":input:disabled").val("jiyunfei");获取多选框选中的个数.                    alert($(":checkbox[name='newsletter']:checked").length);获取多选框选中的内容.                    $(":checkbox[name='newsletter']:checked").each(function () {alert(this.nextSibling.nodeValue);});获取下拉框选中的内容.                    $("select :checked").each(function () {//:号前面需要加空格因为被选择的是子节点<option>alert(this.value);});

                $("#single").val("Single2");$("#multiple").val(["Multiple2", "Multiple3"]);$("input").val(["check2", "radio1"]);

　　　　　　　　  意味着，每次执行传递进来的函数时，函数中的this关键字都指向一个不同的DOM元素（每次都是一个不同的匹配元素）。

　　　　　　　　  而且，在每次执行函数时，都会给函数传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数（从零开始的整形）。

　　　　　　　　  返回 'false' 将停止循环 (就像在普通的循环中使用 'break')。返回 'true' 跳至下一个循环(就像在普通的循环中使用'continue')。

　　　　　　　　  详见api文档

$("p").click( function () { $(this).hide(); });

                //1. hasClass(): 某元素是否有指定的样式alert($("div:first").hasClass("SubCategoryBox")); //true//2. 移除样式$("div:first").removeClass("SubCategoryBox");alert($("div:first").hasClass("SubCategoryBox"));//3. 添加样式$("div:first").addClass("SubCategoryBox");//4. 切换样式: 存在, 则去除; 没有, 则添加. $(".showmore").click(function(){$("div:first").toggleClass("SubCategoryBox");return false;});

                //5. 获取和设置元素透明度: opacity 属性alert($("div:first").css("opacity"));$("div:first").css("opacity", 0.5);//6. width 和 heightalert($("div:first").width());alert($("div:first").height());$("div:first").width(400);$("div:first").height(80);//7. 获取元素在当前视窗中的相对位移: offset(). //其返回对象包含了两个属性: top, left. 该方法只对可见元素有效alert($("div:first").offset().top);alert($("div:first").offset().left);

            $(function () {$(".head").click(function () {//为class为head的节点设置点击事件var flag = $(".content").is(":hidden");//is();看节点是否符合，这里的意思是是否隐藏if (flag) {//如果是隐藏的$(".content").show();//show()方法可以使节点显示} else {$(".content").hide();//hide()方法使节点隐藏
                    }});})

<script type="text/javascript" src="jquery/jquery-3.2.1.js"></script>
<script type="text/javascript">$(function() {//这是一对，主谓颠倒的用法。代表加在最后一个子节点的位置$("<p>你最喜欢的城市？</p>") . appendTo("body");//里面可以使用这样复合的写法。$("<ul id='city'><li id='bj'>北京</li></ul>"),或者去掉$()都行$("body") . append($("<ul id='city'><li id='bj'>北京</li></ul>"));//这一对和上面的相反，是加在第一个子节点的位置$("<li id='xm'>厦门</li>") . prependTo("#city");$("#city") . prepend("<li id='gz'>广州</li>")//插入到某一个子节点的后面$("<li id='jz'>焦作</li>") . insertAfter("#bj");$("#jz") . after("<li id='zz'>郑州</li>")//插入到某一个子节点的前面$("<li id='hd'>邯郸</li>") . insertBefore("#gz");$("#gz") . before("<li id='bd'>保定</li>")})
</script>

                //bind: 为某 jQuery 对象绑定事件. /*$(".head").bind("click", function(){//使用 is() 方法, 来判断某个给定的 jQuery 对象是否符合指定//的选择器. var flag = $(".content").is(":hidden");if(flag){//show() 方法: 使隐藏的变为显示$(".content").show();}else{$(".content").hide();}});*/

                //mouseover: 鼠标移上去//mouseout: 鼠标移出. /*$(".head").mouseover(function(){$(".content").show();}).mouseout(function(){$(".content").hide();});*///合成事件: hover: 鼠标移上去执行第一个函数, 移出执行第二个函数. 效果等同于上面/*$(".head").hover(function(){$(".content").show();}, function(){$(".content").hide();});*/

                //合成事件: toggle: 第一次点击执行第一个函数, 第二次点击执行第二个//函数 ... 循环执行. $(".head").toggle(function(){$(".content").show();}, function(){$(".content").hide();});

        $("html").mousemove(function (event) {$("#message").text("x:" + event.pageX + ",y:" + event.pageY);});

            //演示动画效果: show() 和 hide() 方法中传入毫秒数以达到动画的效果/*$(function(){ $(".head").toggle(function(){$(".content").show(1000);}, function(){$(".content").hide(1000);});})*///只改变高度/*$(function(){ $(".head").toggle(function(){$(".content").slideDown(500);}, function(){$(".content").slideUp(500);});})*///只改变透明度/*$(function(){ $(".head").toggle(function(){$(".content").fadeIn(1000);}, function(){$(".content").fadeOut(1000);});})*///toggle() 可以切换元素的可见状态. //slideToggle(): 通过高度变化来切换匹配元素的可见性//fadeToggle(): 通过透明度来切换元素的可见性.//fadeTo(): 把不透明度以渐近的方式调整到指定的值 (0 – 1 之间). $(function(){ $(".content").show();var i = 1; $(".head").click(function(){//$(".content").toggle();//$(".content").slideToggle();//$(".content").fadeToggle();
                    $(".content").fadeTo("slow", i);i = i - 0.1;});})