电竞比分网-中国电竞赛事及体育赛事平台

分享

JavaScript封裝函數:獲取下一個/上一個兄弟元素節(jié)點

 路人甲Java 2021-09-14

要求:

  1. 獲得下一個/上一個兄弟元素節(jié)點,不包括文本節(jié)點等
  2. 解決IE兼容性問題

代碼實現:

獲得下一個兄弟元素節(jié)點:

function getNextElement(element) {
    var el = element;
    while (el = el.nextSibling) {
        if (el.nodeType === 1) {
            return el;
        }
    }
    return null;
}

獲得上一個兄弟元素節(jié)點:

function getPrevElement(element) {
    var el = element;
    while (el = el.previousSibling) {
        if (el.nodeType === 1) {
            return el;
        }
    }
    return null;
}

實現效果:

有如下兩兄弟標簽:

<div>div</div>
<span>span</span>

獲得下一個兄弟元素節(jié)點:
輸入:

var div = document.querySelector('div');
console.log(getNextElement(div));

輸出:

<span>span</span>

獲得上一個兄弟元素節(jié)點:
輸入:

var span = document.querySelector('span');
console.log(getPrevElement(span));

輸出:

<div>div</div>

    本站是提供個人知識管理的網絡存儲空間,所有內容均由用戶發(fā)布,不代表本站觀點。請注意甄別內容中的聯系方式、誘導購買等信息,謹防詐騙。如發(fā)現有害或侵權內容,請點擊一鍵舉報。
    轉藏 分享 獻花(0

    0條評論

    發(fā)表

    請遵守用戶 評論公約

    類似文章 更多