JQuery 筛选

1.  dom.eq(index)；    返回dom中索引为index的对象

2.  dom.first();  返回dom集合中索引为 0 的对象集合；

3. dom.last() ;  获取dom集合中索引为最后一个对象的集合

4. dom.find(选择器) ； 返回dom后代元素中，符合表达式规则的元素集合；

5. dom.next();  返回dom下一个相邻兄弟节点的集合

6. dom.nextAll();  返回dom后面所有的“兄弟”节点的集合，不包括dom

7. dom.prev();  返回dom前一个相邻的“兄弟”节点的集合；

8. dom.prevAll(); 返回dom前面所有的“兄弟”节点的集合，不包括dom

9. dom.slice(start,end);   截取dom集合中，索引从start开始到end结束，不包括end,所有的元素的集合；

10. dom.children();  返回dom的子代元素，如果传参数（css选择器），则会返回能被选择器选中的子代元素，

11. dom.parent(); 返回dom的父元素，如果传参数css选择器，则会返回能被选择器选中的父代元素

12. dom.parents();  返回dom的祖先元素（包括父元素），如果传参数就是在祖先元素中这个选择器

13. dom.hasClass(class名);  判断dom集合里是否有元素拥有 class类名，如果有返回true  如果没有返回false

14. dom.siblings();  返回dom的所有兄弟节点，包括前面和后面的，但不包括自身

15. dom.filter(选择器/callback);   返回dom中能被选择器选中的元素集合，或者返回dom中符合callback中规则的元素

16. dom.map(callback);   对dom集合中的每一个元素执行callback里面的语句

例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>JQuery 筛选</title>
    <script src="../../jquery.min.js"></script>
</head>
<body>
    <ul>
        <li>1</li>
        <li class="six">2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
        <li class="six">6
            <span>我是用来做测试的</span>
        </li>
        <li>7</li>
        <li>8</li>
        <li>9</li>
    </ul>
    <script>
        // 1.  dom.eq(index)  返回dom中索引为index的对象
        console.log($('li').eq(2));   // 3    获取li中索引为 2 的对象；

        // 2.  dom.first();  返回dom集合中索引为 0 的对象集合；
        console.log($('li').first());  // 1

        //  3. dom.last() ;  获取dom集合中索引为最后一个对象的集合
        console.log($('li').last());  //  9 

        //  4. dom.find(选择器) ； 返回dom后代元素中，符合表达式规则的元素集合；
        console.log($('ul').find('.six'));  // 6

        //  5. dom.next();  返回dom下一个相邻兄弟节点的集合
        console.log($('.six').next());  // 7

        //  6. dom.nextAll();  返回dom后面所有的“兄弟”节点的集合，不包括dom
        console.log($('.six').nextAll()); // 7  8  9

        //  7. dom.prev();  返回dom前一个相邻的“兄弟”节点的集合；
        console.log($('.six').prev()); // 5

        //  8. dom.prevAll(); 返回dom前面所有的“兄弟”节点的集合，不包括dom
        console.log($('.six').prevAll());  //  5 4 3 2 1

        //  9. dom.slice(start,end);   截取dom集合中，索引从start开始到end结束，不包括end,所有的元素的集合；
        console.log($('li').slice(1,4));  //  2 3 4

        //  10. dom.children();  返回dom的子代元素，如果传参数（css选择器），则会返回能被选择器选中的子代元素，
        console.log($('.six').children()); // span    第一种
        console.log($('ul').children('.six'));  // 6  span   第二种

        //  11. dom.parent(); 返回dom的父元素，如果传参数css选择器，则会返回能被选择器选中的父代元素
        console.log($('span').parent());  // 6

        //  12. dom.parents();  返回dom的祖先元素（包括父元素），如果传参数就是在祖先元素中这个选择器
        console.log($('span').parents()); // li six 6 、 ul 、 body 、 html

        //  13. dom.hasClass(class名);  判断dom集合里是否有元素拥有 class类名，如果有返回true  如果没有返回false
        console.log($('li').hasClass('six'));  // true
        console.log($('li').hasClass('si'));  //  false

        //  14. dom.siblings();  返回dom的所有兄弟节点，包括前面和后面的，但不包括自身
        console.log($('.six').siblings());  // 1 2 3 4 5 7 8 9  不包括6

        //  15. dom.filter(选择器/callback);   返回dom中能被选择器选中的元素集合，或者返回dom中符合callback中规则的元素
        console.log($('li').filter('.six'));  //  2  6

        //  16. dom.map(callback);   对dom集合中的每一个元素执行callback里面的语句
        console.log($('.six').map());
    </script>
</body>
</html>