find()和filter()函数的用法区别

103 阅读 0 评论 68 点赞

我是靠谱客的博主贪玩小甜瓜，这篇文章主要介绍find()和filter()函数的用法区别，现在分享给大家，希望可以做个参考。

　　　两个函数的作用都是“筛选”出具有指定选择器的元素，区别的话请看代码：
　　　

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

<script type="text/javascript">
        $(function(){
            alert($("div").filter(".test").html());
            alert($("div").find(".test").html());
        });
</script>

<body>
    <div class="test">
        test1
    </div>
    <div>
        <p class="test">test2</p>
    </div>
</body>

　　　html():获取指定元素的内部html代码，相当于innerHTML。
　　　
　　　当我们运行代码的时候，首先，浏览器会执行第一段代码，输出结果为：
　　　

复制代码

1
test1

　　　接着，第二段代码输出为：
　　　

复制代码

1
test2

　　　可见：
　　　find()函数的“筛选”范围为指定元素的内部即后代元素，上段代码的
　　　$("div").find(".test")
　　　相当于
　　　$(“div .test”) //中间有空格
　　　
　　　而filter()函数的“筛选”范围为指定元素自身，上段 $("div").filter(".test")
　　　相当于
　　　$("div.test") //中间没有空格。
　　　