jQuery的find()方法怎么使用-js教程-PHP中文网

jQuery的find()方法怎么使用

不言

发布： 2018-12-27 17:06:06

原创

7439人浏览过

find() 方法获得当前元素集合中每个元素的后代，通过选择器、jQuery 对象或元素来筛选，本篇文章就来给大家介绍jQuery中find()方法的具体使用方法。

jQuery

find()的使用方法

在选择器之后调用find方法是很常见的。

$(“选择器1”).find(“选择器2”).(“处理方法”);

登录后复制

下面我们来看一下使用find()方法的具体示例

我们更改由span标签包围的元素颜色

代码如下

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script>
      $(function(){
        $("p").find("span").css("color","red");
      });
    </script>
  </head>
  <body>
    <p>黑色<span>红色</span>黑色<span>红色</span></p>
                    <div class="aritcle_card">
                        <a class="aritcle_card_img" href="/xiazai/code/9255">
                            <img src="https://img.php.cn/upload/webcode/000/000/014/175845600383283.jpg" alt="家电小商城网站源码1.0">
                        </a>
                        <div class="aritcle_card_info">
                            <a href="/xiazai/code/9255">家电小商城网站源码1.0</a>
                            <p>家电公司网站源码是一个以米拓为核心进行开发的家电商城网站模板，程序采用metinfo5.3.9 UTF8进行编码，软件包含完整栏目与数据。安装方法：解压上传到空间，访问域名进行安装，安装好后，到后台-安全与效率-数据备份还原，恢复好数据后到设置-基本信息和外观-电脑把网站名称什么的改为自己的即可。默认后台账号：admin 密码：132456注意：如本地测试中127.0.0.1无法正常使用，请换成l</p>
                            <div class="">
                                <img src="/static/images/card_xiazai.png" alt="家电小商城网站源码1.0">
                                <span>0</span>
                            </div>
                        </div>
                        <a href="/xiazai/code/9255" class="aritcle_card_btn">
                            <span>查看详情</span>
                            <img src="/static/images/cardxiayige-3.png" alt="家电小商城网站源码1.0">
                        </a>
                    </div>
                
  </body>
</html>

登录后复制

首先，我们使用p标记包围元素，然后使用find方法指定span标记，并进一步缩小元素范围。

结果处理仅应用于p标记中的span标记内。

运行效果如下

jQuery