js原生遞歸獲取一個(gè)節(jié)點(diǎn)的所有父級(jí)節(jié)點(diǎn)

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <div class="a">
      一級(jí)
      <div class="b">
        二級(jí)
        <div class="c">
          三級(jí)
          <div id="start" class="">
            目標(biāo)
          </div>
        </div>
      </div>
    </div>
  </body>
  <script type="text/javascript">

    let startTag = document.querySelector('#start')

    /**
     * getParentTag - 獲取傳入標(biāo)簽的所有父級(jí)標(biāo)簽
     *
     * @param  { HTMLElement } startTag 初始dom節(jié)點(diǎn)
     * @param  {Array} parentTagList 初始dom節(jié)點(diǎn)的所有父級(jí)節(jié)點(diǎn)
     * @return {type} 遞歸/初始dom節(jié)點(diǎn)的所有父級(jí)節(jié)點(diǎn)
     */
    function getParentTag(startTag, parentTagList = []) {
      // 傳入標(biāo)簽是否是DOM對(duì)象
      if (!(startTag instanceof HTMLElement)) return console.error('receive only HTMLElement');
      // 父級(jí)標(biāo)簽是否是body,是著停止返回集合,反之繼續(xù)
      if ('BODY' !== startTag.parentElement.nodeName) {
        // 放入集合
        parentTagList.push(startTag.parentElement)
        // 再上一層尋找
        return getParentTag(startTag.parentElement, parentTagList)
      }
      // 返回集合,結(jié)束
      else return parentTagList;

    }

    console.log(getParentTag(startTag));
  </script>
</html>
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡書系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容