javascript - 我怎样才能得到一个节点的唯一直接子节点的特定类名？

Question

我怎样才能得到一个节点的唯一直接子节点和一个特定的类名？

例子

<div class="list-group">
  <div class="list-group-item">
    <div class="list-group"> <!--I have this-->
      <div class="list-group-item"> <!--And I want to reach this-->
        <div class="list-group">
          <div class="list-group-item"></div> <!--Not this-->
          <div class="list-group-item"></div>
        </div>
      </div>
      <div class="list-group-item"></div> <!--And get this-->
    </div>
  </div>
</div>

我有一个包含项目和组的列表组，我想保留该层次结构并获取列表组的唯一直接列表组项目。

我该怎么做？

Answer 1

你没有提到你是否使用任何 JS 框架，但是使用 JQuery 它相当简单......只需使用 children()

例如$("#haveThis").children()

您还可以像这样过滤 child :$("#haveThis").children("list-group-item")

文档:https://api.jquery.com/children/

对于 vanilla JS，我会这样做:

[].slice.call(document.getElementById("havethis").children).filter(el=>el.className==='list-group-item')