`
huobengluantiao8
  • 浏览: 1029542 次
文章分类
社区版块
存档分类
最新评论

JQuery中位置选择器:nth-child(N)与:eq(N)的区别

 
阅读更多

1、nth-child(N):下标从1开始;eq(N):下标从0开始

2、nth-child(N):选择多个元素;eq(N):选择一个元素

3、nth-child(N):在一个文档树种中,选择各层排行第N的所有元素。
例:nth-child(2):包括父辈的老二,兄弟的老二,子孙的老二,下图的绿色部分

eq(N):在一个文档树种中,前序排列后,选择第N个元素及其所有子元素。
例:在下面的HTML代码里,查看$("div:eq(3)").html()的结果。(编号就是前序排列的编号)

$("div:eq(3)").html()的选择结果

最后思考个问题:

用了上面两句,所有div的字体颜色会以红蓝间隔的出现吗?答案当然是:不会
测试如下,代码部分:

运行结果:

分享到:
评论

相关推荐

    jQuery中:nth-child选择器用法实例

    本文实例讲述了jQuery中:nth-child选择器用法。分享给大家供大家参考。具体分析如下: 此选择器匹配其父元素下的第N个子或奇偶元素。 :eq(index)选择器只匹配一个元素,而:nth-child选择器将为每一个父元素匹配子...

    jQuery基础教程笔记适合js新手第1/2页

    1, :eq()和nth-child() 看下面代码: [removed] $(function(){ $(“#selected-plays... //而css选择器:nth-child()是从 1 开始的, 所以要选择第二个元素, 得使用 :nth-child(2) ,而不是:nth-child(1)。

    css选择器apolo

    * 参考: jquery css选择器 * 目前实现 * #id 根据给定的ID匹配一个元素 * tagName 匹配给定的元素名的所有元素 * .class 匹配class=class的所有元素 //非IE下,可以直接find * selector1,selector2 将每一个...

    JQuery新版中文手册

    选择器 基本 #id element .class * selector1,selector2,selectorN 层级 ancestor descendant parent > child prev + next prev ~ siblings 基本 :first :last :not(selector) :even :odd :eq...

    jQuery完全实例.rar

    这个函数接收一个包含 CSS 选择器的字符串,然后用这个字符串去匹配一组元素。 jQuery 的核心功能都是通过这个函数实现的。 jQuery中的一切都构建于这个函数之上,或者说都是在以某种方式使用这个函数。这个函数最...

    jquery1.11.0手册

    选择器 基本 #id element .class * selector1,selector2,selectorN 层级 ancestor descendant parent > child prev + next prev ~ siblings 基本 :first :not(selector) :even :odd :eq(index) :...

    Jquery 1.3 简体中文手册

    选择器 基本 #id element .class * selector1,selector2,selectorN 层级 ancestor descendant parent > child prev + next prev ~ siblings 基本 :first :last :not :even :odd :eq :gt :lt :...

    JQuery 1.3 中文参考手册

    选择器 基本 #id element .class * selector1,selector2,selectorN 层级 ancestor descendant parent > child prev + next prev ~ siblings 基本 :first :last :not :even :odd :eq :gt :lt :...

    jQuery 1.4.1 中文参考

    3. 选择器 37 3.1 基本 37 3.1.1 #id 37 3.1.2 element 38 3.1.3 .class 38 3.1.4 * 39 3.1.5 selector1,selector2,selectorN 39 3.2 层级 40 3.2.1 ancestor descendant 40 3.2.2 41 3.2.3 prev + next 41 3.2.4 ...

    jQuery1.4 API

    ) scrollLeft( [val] ) 尺寸 height( [val] ) width( [val] ) innerHeight() innerWidth() outerHeight(options) outerWidth(options) 选择器基本 #id element .class * selector1,selector2,selectorN 层级 ...

    老男孩Python完美实战课程 14期视频教程 28周Python视频教程 1-14周部分

    │ │ ├03 python s14 day 11 jQuery选择器eq和nth-child的区别_rec.mp4 │ │ ├04 python s14 day 11 jQuery表单选择器_rec.mp4 │ │ ├05 python s14 day 11 jQuery操作属性、css和返回顶部实例_rec.mp4 │ │ ...

Global site tag (gtag.js) - Google Analytics