javascript - 我想从带有 css 或 js 的选项卡中隐藏一些选定的 li 元素

Question

我想从搜索选项卡中隐藏一些选项卡。有 ul 和 li 选项卡列表。我想隐藏一些选定的 li 元素。使用 display:none 没有类或 ID。这是代码:

<ul class="nav nav-tabs" role="tablist">
<li role="st_hotel" class="">
   <a href="#st_hotel" aria-controls="st_hotel" role="tab" data-toggle="tab" aria- 
    expanded="false">Hotel</a>
</li>
<li role="st_tours" class="">
    <a href="#st_tours" aria-controls="st_tours" role="tab" data-toggle="tab">Tour</a>
</li>
</ul>

假设我想隐藏第二个 li，即 TOUR。我怎样才能捕获这个李？没有类或 ID。是否可以用#st_tours Angular 色捕捉到这个 li？或任何其他方式？请帮我解决这个问题..

Answer 1

因为它有一个 role 属性，我们可以使用它来选择它。

li[role="st_tours"] {
  display: none;
}

<ul class="nav nav-tabs" role="tablist">
  <li role="st_hotel" class="">
    <a href="#st_hotel" aria-controls="st_hotel" role="tab" data-toggle="tab" aria- expanded="false">Hotel</a>
  </li>
  <li role="st_tours" class="">
    <a href="#st_tours" aria-controls="st_tours" role="tab" data-toggle="tab">Tour</a>
  </li>
</ul>