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 相关文章推荐
Jquery常用技巧收集整理篇
Nov 14 Javascript
JavaScript模拟重力状态下抛物运动的方法
Mar 03 Javascript
jQuery实现图片预加载效果
Nov 27 Javascript
jQuery实现的表格展开伸缩效果实例
Sep 07 Javascript
JS 拦截全局ajax请求实例解析
Nov 29 Javascript
jquery无法为动态生成的元素添加点击事件的解决方法(推荐)
Dec 26 Javascript
JS实现隔行换色的表格排序
Mar 27 Javascript
3种vue组件的书写形式
Nov 29 Javascript
解决jquery validate 验证不通过后验证正确的信息仍残留在label上的方法
Aug 27 jQuery
解决layui checkbox 提交多个值的问题
Sep 02 Javascript
如何在vue中使用百度地图添加自定义覆盖物(水波纹)
Nov 03 Javascript
分享几个JavaScript运算符的使用技巧
Apr 24 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中Session的概念
2006/10/09 PHP
destoon数据库表说明汇总
2014/07/15 PHP
PHP+AjaxForm异步带进度条上传文件实例代码
2017/08/14 PHP
PHP面向对象程序设计模拟一般面向对象语言中的方法重载(overload)示例
2019/06/13 PHP
面向对象的编程思想在javascript中的运用上部
2009/11/20 Javascript
JavaScript入门之基本函数详解
2011/10/21 Javascript
javascript中有趣的反柯里化深入分析
2012/12/05 Javascript
jquery进行数组遍历如何跳出当前的each循环
2014/06/05 Javascript
js实现类似jquery里animate动画效果的方法
2015/04/10 Javascript
js图片卷帘门导航菜单特效代码分享
2015/09/10 Javascript
javascript遍历json对象的key和任意js对象属性实例
2017/03/09 Javascript
js异步编程小技巧详解
2017/08/14 Javascript
Bootstrap modal只加载一次数据的解决办法(推荐)
2017/11/24 Javascript
vue使用element-ui的el-input监听不了回车事件的解决方法
2018/01/12 Javascript
原生js实现Flappy Bird小游戏
2018/12/24 Javascript
vue中keep-alive组件的入门使用教程
2019/06/06 Javascript
node.js实现带进度条的多文件上传
2020/03/27 Javascript
[00:35]DOTA2上海特级锦标赛 VP战队宣传片
2016/03/04 DOTA
使用python实现扫描端口示例
2014/03/29 Python
Python简单读取json文件功能示例
2017/11/30 Python
Python 等分切分数据及规则命名的实例代码
2019/08/16 Python
关于PyTorch 自动求导机制详解
2019/08/18 Python
python实现抠图给证件照换背景源码
2019/08/20 Python
Python爬虫scrapy框架Cookie池(微博Cookie池)的使用
2021/01/13 Python
有趣的流行文化T恤、马克杯、手机壳和更多:Look Human
2019/01/07 全球购物
《雨霖铃》听课反思
2014/02/13 职场文书
运动会通讯稿500字
2014/02/20 职场文书
工程师岗位职责规定
2014/02/26 职场文书
社团2014年植树节活动总结
2014/03/11 职场文书
护理人员的自我评价分享
2014/03/15 职场文书
自动化专业大学生职业生涯规划范文:爱拚才会赢
2014/09/12 职场文书
校长四风对照检查材料
2014/09/27 职场文书
走群众路线学习笔记
2014/11/06 职场文书
导游词之无锡梅园
2019/11/28 职场文书
python实现股票历史数据可视化分析案例
2021/06/10 Python
Mysql 如何合理地统计一个数据库里的所有表的数据量
2022/04/18 MySQL