jQuery初学:find()方法及children方法的区别分析


Posted in Javascript onJanuary 31, 2011

首先看看英文解释吧:
children方法:
jQuery初学:find()方法及children方法的区别分析
find方法:
jQuery初学:find()方法及children方法的区别分析
通过以上的解释,可以总结如下:
1:children及find方法都用是用来获得element的子elements的,两者都不会返回 text node,就像大多数的jQuery方法一样。
2:children方法获得的仅仅是元素一下级的子元素,即:immediate children。
3:find方法获得所有下级元素,即:descendants of these elements in the DOM tree
4:children方法的参数selector 是可选的(optionally),用来过滤子元素,但find方法的参数selector方法是必选的。
5:find方法事实上可以通过使用 jQuery( selector, context )来实现:英语如是说:Selector context is implemented with the .find() method; therefore, $('li.item-ii').find('li') is equivalent to $('li', 'li.item-ii').

例如,有以下html元素:
jQuery初学:find()方法及children方法的区别分析
使用:$('ul.level-2').children().css('border', '1px solid green'); 的效果是:
jQuery初学:find()方法及children方法的区别分析
使用 $('ul.level-2').find('li').css('border', '1px solid green'); 的效果是:
jQuery初学:find()方法及children方法的区别分析

Javascript 相关文章推荐
在修改准备发的批量美化select+可修改select时,在非IE下发现了几个问题
Jan 09 Javascript
两个select之间option的互相添加操作(jquery实现)
Nov 12 Javascript
firefox下frameset取不到值的解决方法
Sep 06 Javascript
详解JavaScript编程中的数组结构
Oct 24 Javascript
jQuery实现多级联动下拉列表查询框
Jan 18 Javascript
jQuery实例—选项卡的简单实现(js源码和jQuery)
Jun 14 Javascript
Javascript中this绑定的3种方法与比较
Oct 13 Javascript
JS实现拖拽的方法分析
Dec 20 Javascript
JavaScript生成简单等差数列
Nov 28 Javascript
postman+json+springmvc测试批量添加实例
Mar 31 Javascript
详解Vue CLI3 多页应用实践和源码设计
Aug 30 Javascript
vue路由跳转传递参数的方式总结
May 10 Javascript
javascript event 事件解析
Jan 31 #Javascript
javascript getElementsByTagName
Jan 31 #Javascript
js对象数组按属性快速排序
Jan 31 #Javascript
javascript 节点排序 2
Jan 31 #Javascript
js自定义事件代码说明
Jan 31 #Javascript
jQuery帮助之筛选查找 children([expr])
Jan 31 #Javascript
jQuery find和children方法使用
Jan 31 #Javascript
You might like
smarty模板嵌套之include与fetch性能测试
2010/12/05 PHP
PHP array操作10个小技巧分享
2011/06/23 PHP
PHP删除数组中特定元素的两种方法
2013/07/02 PHP
PHP 面向对象程序设计(oop)学习笔记(一) - 抽象类、对象接口、instanceof 和契约式编程
2014/06/12 PHP
php连接oracle数据库及查询数据的方法
2014/12/29 PHP
php强制更新图片缓存的方法
2015/02/11 PHP
CodeIgniter整合Smarty的方法详解
2017/08/25 PHP
PHP读取文件或采集时解决中文乱码
2021/03/09 PHP
JavaScript 读取元素的CSS信息的代码
2010/02/07 Javascript
更换select下拉菜单背景样式的实现代码
2011/12/20 Javascript
jquery序列化表单去除指定元素示例代码
2014/04/10 Javascript
JQuery中使用.each()遍历元素学习笔记
2014/11/08 Javascript
jQuery中:image选择器用法实例
2015/01/03 Javascript
深入理解逻辑表达式的用法 与或非的用法
2016/06/06 Javascript
深入分析javascript中console命令
2016/08/14 Javascript
jQuery EasyUI Accordion可伸缩面板组件使用详解
2017/02/28 Javascript
浅谈js使用in和hasOwnProperty获取对象属性的区别
2017/04/27 Javascript
React-Router如何进行页面权限管理的方法
2017/12/06 Javascript
javaScript实现游戏倒计时功能
2018/11/17 Javascript
Vue+Element实现表格编辑、删除、以及新增行的最优方法
2019/05/28 Javascript
Vue数据驱动表单渲染,轻松搞定form表单
2019/07/19 Javascript
JS正则表达式验证端口范围(0-65535)
2020/01/06 Javascript
vue+elementui实现点击table中的单元格触发事件--弹框
2020/07/18 Javascript
解决vue中axios设置超时(超过5分钟)没反应的问题
2020/09/04 Javascript
[40:03]Liquid vs Optic 2018国际邀请赛淘汰赛BO3 第一场 8.21
2018/08/22 DOTA
[49:05]OG vs Newbee 2019DOTA2国际邀请赛淘汰赛 胜者组 BO3 第二场 8.21.mp4
2020/07/19 DOTA
python3中str(字符串)的使用教程
2017/03/23 Python
Python图像处理之gif动态图的解析与合成操作详解
2018/12/30 Python
Kangol帽子官网:坎戈尔袋鼠
2018/09/26 全球购物
最新远光软件笔试题面试题内容
2013/11/08 面试题
趣味比赛活动方案
2014/02/15 职场文书
营销总监岗位职责范本
2014/02/26 职场文书
师范教师专业大学生职业生涯规划范文
2014/03/02 职场文书
学校出纳员岗位职责
2014/03/18 职场文书
坎儿井导游词
2015/02/09 职场文书
CSS实现隐藏搜索框功能(动画正反向序列)
2021/07/21 HTML / CSS