jQuery选择器

$("[id^='div']"):选取id是div开头的

$("[id|='div']"):选取id是div开头或id等于div

$("[id$='div']"):选取id是div结尾的

$("[id*='div']"):选取id包含div的

$("[id~='div']"):选取id包含特定单词div的

$("div[id^=div]div[id$='a1']"):选取id以div开头a1结尾的的div（复式属性选择器 ）

:even：偶数成员

:odd：奇数成员

:first：第一个元素

:last：最后一个元素

:eq(3)：第四个元素

:gt(2)：索引值大于2

:lt(3)：索引值小于3

:header：标题元素：h1，h2等

:input：获取所有的表单元素，可以获取到form表单下面的所有的元素（input,textarea,select,button）

:contains：过滤器：匹配包含文本的元素

:has：匹配后代包含元素的元素：$("div:has('p')")匹配后代包含p元素的div

:empty：选择无子元素和任何内容的空元素

:parent：选择具有子元素的的元素

:first-child：父元素的第一个元素

:last-child：父元素的最后一个元素

:nth-child()：父元素的第nth-child()个元素

:only-child：父元素的唯一一个子元素

扩展自定义的选择器（$.expr[":"]）：下面的代码是选择第一个div中width是10px的

<div style=" 10px;height: 10;background-color: green;"></div>
<div style=" 10;height: 10;background-color: red;"></div>
<div style=" 10;height: 10;background-color: grey;"></div>
<script>
    $(function(){
        $.expr[":"].abc = function(element){
            return $(element).css("width") === "10px";
        };

        var n= $("div:abc").length;
        console.log(n);
    })
</script>

.find和.children的区别是，find是在所有的后代元素中查找，children是在子元素中查找

.eq()和.get()的区别是，.eq返回object对象，.get返回dom节点

.index返回元素的索引：下面的代码返回1（也可以通过：$("ul>li#li2").prevAll().length获取）

<ul>
    <li id="li1">1</li>
    <li id="li2">2</li>
    <li id="li3">3</li>
</ul>
<script>
    $(function(){
        var item2= $("#li2");
        console.log($("li").index(item2));
    })
</script>

.end()返回最初的包装对象：第二个li红色，掐面的li蓝色

<ul>
    <li id="li1"><span>1</span></li>
    <li id="li2"><span>2</span></li>
    <li id="li3"><span>3</span></li>
</ul>
<script>
    $(function(){
        $("#li2").find("span").css("color",'red').end().prevAll().find("span").css("color","blue").end();

    })
</script>

.siblings：获取所有的兄弟