jQuery实现获取子元素的方法分析

4月以前  |  阅读数:20 次  |     收藏

这篇文章主要介绍了Jquery实现获取子元素的方法,结合实例形式分析了jQuery针对页面元素的查找、获取相关操作技巧.

本文实例讲述了Jquery实现获取子元素的方法。分享给大家供大家参考,具体如下:

Jquery获取子元素的方法有2种,分别是children()方法和find()方法。下面我们分别来使用这两种方法,看看它们有何差异。

1.children()方法:获取该元素下的直接子集元素

2.find()方法:获取该元素下的所有子集元素

分别以以下HTML代码为例:

<ul>
  <li>
    list1
    <ul>
      <li>
        list1-1
      </li>
      <li>
        list1-2
      </li>
    </ul>
  </li>
  <li>
    list2
    <ul>
      <li>
        list2-1
      </li>
      <li>
        list2-2
      </li>
    </ul>
  </li>
  <li>
    list3
    <ul>
      <li>
        list3-1
      </li>
      <li>
        list3-2
      </li>
    </ul>
  </li>
</ul>

3、children()方法获取ul下面直接子集元素li:$("ul").children("li")

需要注意的是,如果li元素下还有li元素,children方法将不会被获取。我们可以用length来测试获取的个数“$("ul").children("li").length”,最后输出结果为3

4、find()方法获取ul下所有元素li:$("ul").find("li")

需要注意的是,find方法会无限循环查找ul标签节点下的li,一直找到没有为止,用length来测试获取个数“$("ul").find("li").length”,最后输出结果为9

5、children和find的区别:children只会查找直接子集,而find会跨越层级查找,一直找到没有为止。

相关文章:


SSH 登录失败:Host key verification failed

PHP分页显示制作详细讲解

PHP自定义函数获取搜索引擎来源关键字的方法

在Zeus Web Server中安装PHP语言支持

将二进制数据转为16进制以便显示

让你成为最历害的git提交人

再谈PHP中单双引号的区别详解

PHP实现简单爬虫的方法

php+ajax+json 详解及实例代码

Python 2与Python 3版本和编码的对比

php实现数组中索引关联数据转换成json对象的方法

桌面中心(一)创建数据库

wget使用技巧

PHP设计模式之工厂模式与单例模式

php封装的page分页类完整实例

php数组合并array_merge()函数使用注意事项

Yii2汉字转拼音类的实例代码

获取IMSI

getAttribute和getAttributeNode

Java生成UUID