jquery过滤选择器

最新推荐文章于 2024-09-06 10:19:06 发布

天空守护云

最新推荐文章于 2024-09-06 10:19:06 发布

阅读量68

点赞数

本文链接：https://blog.csdn.net/weixin_44606660/article/details/88062821

版权

<!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>Document</title>
    <style>
        .box{
            width: 50px;
            height: 50px;
            border: 1px solid #ddd;
            float: left;
            margin: 5px;
        }
    </style>
</head>
<body>
    <div class="box">1</div>
    <div class="box">2</div>
    <div class="box">3</div>
    <div class="box">4</div>
    <div class="box">5</div>
    <div class="box">6</div>
    <div class="box">7</div>
    <div class="box">8</div>
    <div class="box">9</div>
    <div class="box">10</div>

    <div class="a">苹果笔记本</div>
    <div class="b">联想笔记本</div>
    <div class="b">跳绳</div>
    <div class="b">羽毛球</div>

    <h2>A</h2>
    <h2>B</h2>
    <h2>C</h2>

    <script src="lib/jquery-3.3.1.js"></script>

    <script>
        $('.box:first').css('background-color','blue');
        $('.box:last').css('background-color','yellow');
        $('.box:eq(1)').css('color','red');//索引为1的
        $('.box:odd').css('color','pink');//索引为奇数的
        $('.box:gt(3)').css('color','yellow');//索引大于3的
        // $('h2,h3,h5').css('color','red');
        $(':header').css('color','blue');
        var $os=$('div:not(.b)');
    </script>
    
</body>
</html>