nth-of-type但忽略一些元素

Question

如果你有这个html：

小提琴：https://jsfiddle.net/qujo0w00/

<article class="type-a">Content A</article>
<article class="type-b">Content B</article>
<article class="type-b">Content B</article>
<article class="type-b">Content B</article>
<article class="type-b">Content B</article>
<article class="type-a">Content A</article>
<article class="type-b">Content B</article>
<article class="type-b">Content B</article>
<article class="type-a">Content A</article>
<article class="type-b">Content B</article>
<article class="type-b">Content B</article>

你如何定位HAS type-b类的每一个元素？因为，如果你使用

.type-b:nth-of-type(2n+2) { background-color: red; }

它针对第二篇文章，即使第一篇文章没有type-b类。然后它似乎随机工作，一次跳过3篇文章。

我对发生的事情感到困惑，有人能否对此有所了解？

我甚至尝试过：

article:not(.type-a):nth-of-type(2n+2) { background-color: red; }

但仍然是同样的问题。