元素个数不固定情况下如何选择第一个指定类名的子元素？

Question

<div class="main">
<div class="activeBar"></div>
<div class="activeBar"></div>*n
<div class="activeBar"></div>
<div class="item"></div>
<div class="item"></div>*n
<div class="item"></div>
</div>
activeBar 和 item 的数量均不固定，请问能否通过 css 的方法选择到第一个 item

.item:first-child，只适用于父元素第一个且类名为 item 的元素
:first-of-type，只适用于标签

Answer 1

:nth-child(<nth> [of <complex-selector-list>]?)
https://zhuanlan.zhihu.com/p/627631356

Answer 2

如果 .item 都在同一层级，可以 .item:not(.item ~ .item)

Answer 3

没太看明白问题，反正你要找 .item，跟 .activeBar 就没有关系，直接 .getElementsByClassName('item')[0] 就行了吧。

另外，类名最好不要用驼峰，连接号 .active-bar 更好。