[jQuery]table元素和其他元素在遍历的时候有点不一样

希望解决的问题:

一个table元素,需要用jQuery找到第3行第4列对应的�单元格,

尝试解决方案:

  $("table").children("tr:eq(2)").children("td:eq(3)")
//tr:eq(2)是给children传参数,将结果限定为tr元素,而且是第2+1=3个
//eq(2)虽然是在selector里面好像css语句的样子,但是还是javascript这一边的
//然而这两条注释并不是这篇文章主要想说的

上面的代码乍一看没问题,就是跑不起来而已。

除错:

console.log($("table").children())
//[tbody, prevObject: jQuery.fn.init[1], context: document]
console.log($("table").children().children())
//[tr, tr, tr, tr, tr, tr, tr, tr, tr, prevObject: jQuery.fn.init[1], context: document]

个人理解

  • 所以table的children不是tr,而是tbody这个东西,tbody的儿子才是tr。jQuery官方api关于children()的例子只是用了div和ul这些元素,这些元素是不会冒出些divbody或者ulbody之类东西的。
  • jQuery的遍历方法,除了.children(),还有.find()。如果把最开始出错的程序里面children全部改成find的话也可以顺利运行。因为find是逐级往下找的,children则限制在子这一级。
  • 顺便吐槽一下,自己觉得find效率应该是没有children高的,谁叫他名字是find呢
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • DOM创建节点及节点属性 通过JavaScript可以很方便的获取DOM节点,从而进行一系列的DOM操作。但实际上...
    阿r阿r阅读 1,035评论 0 9
  • 1:jQuery节点创建与属性的处理 创建元素节点:可以有几种方式,后面会慢慢接触。常见的就是直接把这个节点的结构...
    码农小杨阅读 620评论 0 1
  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 1,367评论 0 2
  • $(”p”).addClass(css中定义的样式类型); 给某个元素添加样式 $(”img”).attr({sr...
    专注寒冰三千岁阅读 513评论 0 4
  • Attribute: $("p").addClass(css中定义的样式类型); 给某个元素添加样式 $("img...
    扑克脸_457e阅读 583评论 0 1