javascript - 查找与该元素关联的所有父 anchor 标记

Question

我需要找到所有 anchor 标记，直到特定元素的父级。例子在这里-

<li id="li4">
  <a id="ancHideShow4" onclick="hide('4');" href="#" style="font-weight:bold;">SECURITY</a>
  <ul id="ul4" style="display: block; margin-left: -20px; list-style: none;">
    <img onclick="hide('5');" id="img5" src="../../images/asd.gif" class="Hover">
    <li id="li5">
      <a id="ancHideShow5" onclick="hideshow('5');" href="#" style="">GROUP</a>
      <ul id="ul5" style="">
        <div class="QWER"></div>
        <li id="leafli6">
          <a id="ancRedirect312" onclick="Redirect('#')" href="#"><span>XYZ</span></a>
        </li>
      </ul>
    </li>
  </ul>
</li>

所以，如果我点击 -->“ancRedirect312”

应该可以找到这些 ID --> ancRedirect5、ancRedirect4

救救我!!

Answer 1

您可以找到所有父 li 元素及其 子元素，例如

$('a').click(function() {
  var ids = $(this).closest('li').parents('li').children('a').map(function() {
    return this.id
  }).get();
  alert(ids)
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul>
  <li id="li4">
    <a id="ancHideShow4" onclick="hide('4');" href="#" style="font-weight:bold;">SECURITY</a>

    <ul id="ul4" style="display: block; margin-left: -20px; list-style: none;">
      <img onclick="hide('5');" id="img5" src="../../images/asd.gif" class="Hover" />
      <li id="li5">
        <a id="ancHideShow5" onclick="hideshow('5');" href="#" style="">GROUP</a>

        <ul id="ul5" style="">
          <div class="QWER"></div>

          <li id="leafli6">
            <a id="ancRedirect312" onclick="Redirect('#')" href="#"><span>XYZ</span></a>
          </li>

        </ul>
      </li>

    </ul>
  </li>
</ul>