javascript - 仅当列表项具有某个类时才显示子元素

Question

我有这个旋转木马。带有类的列表项indicator显示了我当前在轮播中的位置，并且位于具有绝对位置的其他列表项之上。如您所见，每个其他列表项都包含一个锚点。

现在每个列表项都有一个锚作为其子项。

现在我只想在列表项具有 class 时显示锚点main-pos。

<ul class="carousel">
  <li class="indicator"></li>

  <li class="items main-pos" onclick="currentSlide(1)" id="1">
    <a href="#about">item 1</a>
  </li>
  <li class="items right-pos" onclick="currentSlide(2)" id="2">
    <a href="#">item 2</a>
  </li>
  <li class="items back-pos" onclick="currentSlide(3)" id="3">
    <a href="#">item 3</a>
  </li>
  <li class="items back-pos" onclick="currentSlide(4)" id="4">
    <a href="#">item 4</a>
  </li>
  <li class="items back-pos" onclick="currentSlide(5)" id="5">
    <a href="#">item 5</a>
  </li>
  <li class="items back-pos" onclick="currentSlide(6)" id="6">
    <a href="#">item 6</a>
  </li>
  <li class="items left-pos" onclick="currentSlide(7)" id="7">
    <a href="#">item 7</a>
  </li>
</ul>

标签： javascripthtmlcss

Answer 1

不是这么简单吗？

.items a {display: none;}
.items.main-pos a {display: block;}
.items.main-pos span {display: none;}