Jquery中children与find之间的区别详细解析


Posted in Javascript onNovember 29, 2013

首先看一段HTML代码,如下:

<table id="tb">
            <tr>
                <td>0</td>
                <td>1</td>
                <td>2</td>
            </tr>
            <tr>
                <td>3</td>
                <td>4</td>
                <td>5</td>
            </tr>
 </table>

如果我要获取第二个tr里的第二个td的值:

Children:

$("#tb>tbody").children("tr:eq(1) td:eq(1)").html()

Find    :
$("#tb>tbody").find("tr:eq(1) td:eq(1)").html()

  结果,通过children获取的值为:null,而通过find获取的值为:4 这是为什么呢?

  查了一下资料,通过children获取的是该元素的下级元素,而通过find获取的是该元素的下级所有元素。

  这时回到上面,我们可以得出,$("#tb>tbody").children() 获取的是两个tr元素(不包括它们子元素td),

  而children里面的选择器则是在获取的两个tr元素里再根据条件进行筛选,所以上面那种写法获取不到值。

  如果一定用children我们可以这样写:

$("#tb>tbody").children("tr:last").children("td:eq(1)").html()
Javascript 相关文章推荐
Javascript this指针
Jul 30 Javascript
Jquery css函数用法(判断标签是否拥有某属性)
May 28 Javascript
点击表单提交时出现jQuery没有权限的解决方法
Jul 23 Javascript
jquery自动补齐功能插件flexselect用法示例
Aug 06 Javascript
JS实现放大、缩小及拖拽图片的方法【可兼容IE、火狐】
Aug 23 Javascript
Bootstrap基本插件学习笔记之模态对话框(16)
Dec 08 Javascript
基于JS实现带动画效果的流程进度条
Jun 01 Javascript
浅谈Node.js 中间件模式
Jun 12 Javascript
vue项目中实现的微信分享功能示例
Jan 21 Javascript
Vue 中可以定义组件模版的几种方式
Aug 06 Javascript
vue中使用带隐藏文本信息的图片、图片水印的方法
Apr 24 Javascript
javascript实现放大镜功能
Dec 09 Javascript
JS关键字球状旋转效果的实例代码
Nov 29 #Javascript
JS Loading功能的简单实现
Nov 29 #Javascript
分享Javascript中最常用的55个经典小技巧
Nov 29 #Javascript
浅析JavaScript中的类型和对象
Nov 29 #Javascript
JavaScript中创建类/对象的几种方法总结
Nov 29 #Javascript
转换字符串为json对象的方法详解
Nov 29 #Javascript
javascript对下拉列表框(select)的操作实例讲解
Nov 29 #Javascript
You might like
php使用curl通过代理获取数据的实现方法
2016/05/16 PHP
PHP常用函数之格式化时间操作示例
2019/10/21 PHP
Laravel 5+ .env环境配置文件详解
2020/04/06 PHP
学习YUI.Ext第七日-View&amp;JSONView Part Two-一个画室网站的案例
2007/03/10 Javascript
javascript 一个自定义长度的文本自动换行的函数
2007/08/19 Javascript
我的Node.js学习之路(四)--单元测试
2014/07/06 Javascript
使用jquery菜单插件HoverTree仿京东无限级菜单
2014/12/18 Javascript
JavaScript实现动画打开半透明提示层的方法
2015/04/21 Javascript
JavaScript如何获取数组最大值和最小值
2015/11/18 Javascript
详解JavaScript异步编程中jQuery的promise对象的作用
2016/05/03 Javascript
使用clipboard.js实现复制功能的示例代码
2017/10/16 Javascript
JS从非数组对象转数组的方法小结
2018/03/26 Javascript
JavaScript对象的浅拷贝与深拷贝实例分析
2018/07/25 Javascript
微信小程序实现banner图轮播效果
2020/06/28 Javascript
详解微信小程序回到顶部的两种方式
2019/05/09 Javascript
[01:27:44]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Aster BO3 第一场 1月24日
2021/03/11 DOTA
Python对列表中的各项进行关联详解
2017/08/15 Python
Python中的取模运算方法
2018/11/10 Python
浅析python的优势和不足之处
2018/11/20 Python
使用Python制作一个打字训练小工具
2019/10/01 Python
python实现图片插入文字
2019/11/26 Python
PyTorch中的padding(边缘填充)操作方式
2020/01/03 Python
python基本算法之实现归并排序(Merge sort)
2020/09/01 Python
英国第一的市场和亚马逊替代品:OnBuy
2019/03/16 全球购物
eBay英国购物网站:eBay.co.uk
2019/06/19 全球购物
大学自主招生推荐信
2014/05/10 职场文书
水污染治理工程专业自荐信
2014/06/21 职场文书
电子商务专业毕业生自荐书
2014/06/22 职场文书
暑期学习心得体会
2014/09/02 职场文书
超市开店计划书
2014/09/15 职场文书
2014国庆节商场促销活动策划方案
2014/09/16 职场文书
学生保证书格式
2015/02/27 职场文书
银行中层干部培训心得体会
2016/01/11 职场文书
Golang 结构体数据集合
2022/04/22 Golang
德生TECSUN S-2000使用手册文字版
2022/05/10 无线电
win11自动弹出虚拟键盘怎么关闭? Win11关闭虚拟键盘的技巧
2023/01/09 数码科技