eq、lt、gt、first、last、body>div、id、tag

最新推荐文章于 2024-03-25 09:48:58 发布

0123_k

最新推荐文章于 2024-03-25 09:48:58 发布

阅读量873

点赞数 1

分类专栏： jQuery

本文链接：https://blog.csdn.net/CSDN_kelulian/article/details/52328294

版权

jQuery 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<div>1</div>
<div>2</div>
<div>3</div>
<div>4
    <div>5
        <div>6</div>
    </div>
</div>
<div>7
    <div>8
        <div>9
            <div>10</div>
        </div>
    </div>
</div>
<div>11</div>

<script type="text/javascript" src="assets/plugins/jquery.min.js"></script>
<script type="text/javascript">
    /*元素、id选择器*/
    $("#btn").click(function () {
        $("div").css("background","yellow");
    });
    $("#btn2").click(function () {
        $("div").css("background","red");
    });
    $("#btn3").click(function () {
        $("div").css("background","green");
    });

    /*子代、后代选择器 ，（eq lt gt）下标从0开始且都不包含本身*/
//    $("body div").css("border","2px solid red");
//    $("div:first").css("border","2px solid red");
    $("div:last").css("border","2px solid red");
//    $("div:eq(1)").css("border","2px solid red");
//    $("div:eq(9)").css("border","2px solid red");
//    $("div:lt(2)").css("border","2px solid red");
//    $("div:gt(2)").css("border","2px solid red");
//    $("body>div").css("border","2px solid red");
//    $("body>div>div").css("border","2px solid red");
    //todo
//    $("div>div").css("border","2px solid red");
</script>