jquery：css第一个孩子不工作

Question

我有以下html：

Application.Calculation =xlCalculationAutomatic

以下jquery：

<div class="item-box-desc">
<h1>title</h1>
<p>1</p>
<p>2</p>
</div>

<div class="item-box-desc">
<h1>title</h1>
<p>3</p>
<p>4</p>
</div>

我希望能够为每个div的$('.item-box-desc p:first-child').css({ 'font-weight': 'bold' }) 的第一个元素应用粗体。在这种情况下，1和3应以粗体显示。但我的代码并没有适用它。

Answer 1

您可以使用纯CSS和:nth-of-type selector：

执行此操作

.item-box-desc p:nth-of-type(1) {
  font-weight: bold;
}

<div class="item-box-desc">
  <h1>title</h1>
  <p>1</p>
  <p>2</p>
</div>

<div class="item-box-desc">
  <h1>title</h1>
  <p>3</p>
  <p>4</p>
</div>

:first-child（在CSS和jQuery中）将无效，因为第一个<p>元素不是<div>的第一个子元素; <h1>是。