选择兄弟元素中的第几个元素 |
您所在的位置：网站首页 › jquery找到指定元素的第二个元素是什么 › 选择兄弟元素中的第几个元素 |
选择兄弟元素中的第几个元素
|
:nth-child(an+b)
这个CSS伪类首先找到所有当前元素的兄弟元素，然后按照位置先后顺序从1开始排序，选择的结果为CSS伪类:nth-child括号中表达式（an+b）匹配到的元素集合（n=0，1，2，3...） 0n+3或简单的3匹配第三个元素。1n+0 或简单的 n 匹配每个元素。2n+0 或简单的 2n 匹配位置为 2、4、6、8…的元素（n=0时，2n+0=0，第0个元素不存在，因为是从1开始排序)。你可以使用关键字 even 来替换此表达式。2n+1 匹配位置为 1、3、5、7…的元素。你可以使用关键字 odd 来替换此表达式。3n+4 匹配位置为 4、7、10、13…的元素。a 和 b 都必须为整数，并且元素的第一个子元素的下标为 1。换言之就是，该伪类匹配所有下标在集合 { an + b; n = 0, 1, 2, …} 中的子元素。另外需要特别注意的是，an 必须写在 b 的前面，不能写成 b+an 的形式。例： Document .parent p:nth-child(1){ color: red; } .parent p:nth-child(2){ color: blue; } .parent p:nth-child(3){ color: green; } 我是p1 我是p2 我是p3 我是p4 我是p5
这个css伪类从兄弟节点中从后往前匹配处于某些位置的元素。 注意: 这个伪类和 [:nth-child] 基本一致, 但它是从**结尾**计数, 而不是从开始计数。 例：获取下面div元素的倒数第二个p /* 倒数第二个 */ .parent p:nth-last-child(2){ color: blue; } /* 或 */ /* .parent p:nth-child(3){ color: blue; } */ 我是p1 我是p2 我是p3 我是p4
表示在一组兄弟元素中的第一个元素。 最初定义时，所选元素必须有一个parent。而从选择器 Level 4 开始，parent不再是必须的。 ul li:first-child{ color:red; } Item 1 Item 2 Item 3与之对应的是:last-child 除了CSS选择器外，我们还可以使用jQuery选择器：:eq() :eq(index) 选择器选取带有指定 index 值的元素。index 值从 0 开始，所有第一个元素的 index 值是 0（不是 1）。上面的CSS选择器都是从1 开始的。index是可以为负数的，如果提供负数，则指示从集合结尾开始的位置，而不是从开头开始。它与css选择器的区别是，:eq()每次只能选择一个元素。 // 首先要引入jQuery // 类parent下的第一个p元素 $('.parent p:eq(0)') // 类parent下倒数第一个p元素 $('.parent p:eq(-1)') |
【本文地址】
今日新闻 |
推荐新闻 |