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 相关文章推荐
js 刷新页面的代码小结 推荐
Apr 02 Javascript
jquery easyui 对于开始时间小于结束时间的判断示例
Mar 22 Javascript
JavaScript中合并数组的N种方法
Sep 16 Javascript
JavaScript通过事件代理高亮显示表格行的方法
May 27 Javascript
学习javascript面向对象 javascript实现继承的方式
Jan 04 Javascript
JS实现图片局部放大或缩小的方法
Aug 20 Javascript
bootstrap滚动监控器使用方法解析
Jan 13 Javascript
BootStrap注意事项小结(五)表单
Mar 10 Javascript
基于vue实现swipe分页组件实例
May 25 Javascript
JS抛物线动画实例制作
Feb 24 Javascript
JS实现水平遍历和嵌套递归操作示例
Aug 15 Javascript
javascript开发实现贪吃蛇游戏
Jul 31 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
全国FM电台频率大全 - 12 安徽省
2020/03/11 无线电
php db类库进行数据库操作
2009/03/19 PHP
生成随机字符串和验证码的类的PHP实例
2013/12/24 PHP
php利用fsockopen GET/POST提交表单及上传文件
2017/05/22 PHP
Ajax中的JSON格式与php传输过程全面解析
2017/11/14 PHP
php实现往pdf中加数字签名操作示例【附源码下载】
2018/08/07 PHP
js 替换
2008/02/19 Javascript
修改js Calendar日历控件 兼容IE9/谷歌/火狐
2013/01/04 Javascript
js怎么覆盖原有方法实现重写
2014/09/04 Javascript
浅谈类似于(function(){}).call()的js语句
2015/03/30 Javascript
JS实现支持Ajax验证的表单插件
2016/03/24 Javascript
javascript中利用柯里化函数实现bind方法【推荐】
2016/04/29 Javascript
jquery 判断selection range 是否在容器中的简单实例
2016/08/02 Javascript
JQueryEasyUI之DataGrid数据显示
2016/11/23 Javascript
js倒计时小实例(多次定时)
2016/12/08 Javascript
jQuery EasyUI Draggable拖动组件
2017/03/01 Javascript
微信通过页面(H5)直接打开本地app的解决方法
2017/09/09 Javascript
NodeJs搭建本地服务器之使用手机访问的实例讲解
2018/05/12 NodeJs
Node.js控制台彩色输出的方法与原理实例详解
2019/12/01 Javascript
原生JS实现贪吃蛇小游戏
2020/03/09 Javascript
11个Javascript小技巧帮你提升代码质量(小结)
2020/12/28 Javascript
Python合并字典键值并去除重复元素的实例
2016/12/18 Python
使用pyecharts无法import Bar的解决方案
2020/04/23 Python
python实现二叉查找树实例代码
2018/02/08 Python
Numpy中转置transpose、T和swapaxes的实例讲解
2018/04/17 Python
python matplotlib包图像配色方案分享
2020/03/14 Python
使用CSS3制作一个简单的进度条(demo)
2017/05/23 HTML / CSS
美体小铺美国官网:The Body Shop美国
2017/11/10 全球购物
爱尔兰灯和灯具网上商店:Lights.ie
2018/03/26 全球购物
师范应届生语文教师求职信
2013/10/29 职场文书
模具专业毕业推荐信
2014/03/08 职场文书
2014机关党员干部“正风肃纪”思想汇报
2014/09/15 职场文书
2014房屋登记授权委托书
2014/10/13 职场文书
如何写通讯稿
2015/07/22 职场文书
python控制台打印log输出重复的解决方法
2021/05/14 Python
React forwardRef的使用方法及注意点
2021/06/13 Javascript