选择正文的第 n 个 h3 元素 [重复]答案

【问题标题】：Select nth h3 element of body [duplicate]选择正文的第 n 个 h3 元素 [重复]
【发布时间】：2014-12-21 06:50:24
【问题描述】：

如何选择（例如）我的 body 的第二个 h3 元素而不影响它们之间的元素？

nth-of-type 不起作用，因为它将选择第一个父级！

这是我的jsfiddle（对不起，因为它是外国的，代码没有缩短）

<http://jsfiddle.net/tg7of5sp/>

【问题讨论】：

没有。不管是哪个孩子，只要是h3。所以我想要在代码中输入的第二个 h3
请与您要选择的 h3 元素共享示例代码，因为它不明显
您应该澄清问题（通过编辑问题）。当您说 nth-of-type 不起作用时，您可能意味着您想要选择（例如）h3 元素，该元素是 body 的所有 h3 descendants 中的第二个元素元素，按源代码中出现的顺序计数。
@JukkaK.Korpela 谢谢，这就是我的意思。对不起，不是天生的英语母语者。

标签： css css-selectors

【解决方案1】：

nth-of-type()

:nth-of-type(n) 选择器匹配第 n 个元素其父级的特定类型的子级。n 可以是数字，a 关键字或公式。

See Refrence

工作演示选择正文的第二个 h3

body>h3:nth-of-type(2){
    color:red;
    }

<body>
  <h3>1st Heading h3</h3>
  <div>
    
  <h3>div 1st Heading h3</h3>
   <h3>div 2nd Heading h3</h3>

    </div>
  
  <h3>2nd Heading h3</h3>
  </body>

【讨论】：

这不会只匹配作为第三个元素的 h3 吗？不是第三个h3？还是我弄错了第n个孩子？（从来没有用过太多 - 我不得不承认..）
不工作，每个 h3 元素的父元素不是 body，它主要是一个 div。我想选择正文中的第二个 h3
这些与数组不同，所以 1 等于第一个孩子.. @FrederikSpang
@someuseryoudontknowthenameof 已编辑，看看是否有效
不知道为什么，但它不起作用。