jQuery筛选

最新推荐文章于 2022-06-09 10:30:15 发布

噢啦噢啦噢啦

最新推荐文章于 2022-06-09 10:30:15 发布

阅读量267

点赞数

分类专栏： HTML.

本文链接：https://blog.csdn.net/qq_35860368/article/details/53679241

版权

HTML. 专栏收录该内容

19 篇文章

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        div{
            width: 100px;
            height: 100px;background-color: #ffa24a;
            margin-bottom: 20px;
        }
    </style>
</head>
<body>
<ul>
    <li>黄焖鸡</li>
    <li>面条</li>
    <li>空盘子</li>
</ul>
<div class="box">
    <span class="span">span</span>
</div>
<div class="box1">
    <span>span</span>
</div>
<script src="js/jQuery-2.2.2-min.js"></script>
<script>
    /*不推荐：js和jquery混合使用*/
    console.info($("li")[0]);

    console.info($("li").html());

    /*获取到集合中指定下标的元素*/
    console.info($("li").eq(-1));

    /*first()*/
    console.info($("li").first());

    /*last()*/
    console.info($("li").last())

    /*hasClass()判断当前元素是否有指定class属性,jquery,获取到一个集合，取出集合中的所有内容，默认返回第一个元素的内容*/
    var res = $("li").hasClass("li");

    /*html();*/
    $("li").addClass("as");
    console.info(res);

    /*each()循环取出内容*/
    $("li").each(function(){
        console.info($(this).html());
    });

    /*filter()从集合中筛选出符合指定条件的元素*/
    var odiv = $("div").filter(".div");
    console.info(odiv);

    /*has()包含：获取的元素内部的条件是否符合要求*/
    //$("div").has(".span").css("background-color","red");

    /*find():针对的是子类*/
    //链式表达
    $("div").find(".span").css("background-color","red");

    /*is():用来判断释放满足指定条件*/
    var boo =$(".span").parent().is(".box");
    console.info(boo);

    boo = $(".box").children().is(".span");
    console.info(boo);
</script>
</body>
</html>