JavaScript實(shí)現(xiàn)獲取某個(gè)元素相鄰兄弟節(jié)點(diǎn)的prev與next方法

更新時(shí)間：2016年01月25日 15:12:59 作者：m1870164

這篇文章主要介紹了JavaScript實(shí)現(xiàn)獲取某個(gè)元素相鄰兄弟節(jié)點(diǎn)的prev與next方法,涉及JavaScript基于函數(shù)的判定及調(diào)用previousSibling與nextSibling的相關(guān)技巧,需要的朋友可以參考下

本文實(shí)例講述了JavaScript實(shí)現(xiàn)獲取某個(gè)元素相鄰兄弟節(jié)點(diǎn)的prev與next方法。分享給大家供大家參考，具體如下：

/**
* 獲取相鄰元素
* @param ele 參考物元素
* @param type 類型，上一個(gè)(1)or下一個(gè)(0)
* @return 返回查找到的元素Dom對(duì)象，無則返回null
*/
function getNearEle(ele, type) {
  type = type == 1 ? "previousSibling" : "nextSibling";
  var nearEle = ele[type];
  while(nearEle) {
    if(nearEle.nodeType === 1) {
      return nearEle;
    }
    nearEle = nearEle[type];
    if(!nearEle) {
      break;
    }
  }
  return null;
}
/**
* 獲取當(dāng)前執(zhí)行對(duì)象的上一個(gè)元素
*/
function prev() {
  return getNearEle(this, 1);
}
/**
* 獲取當(dāng)前執(zhí)行對(duì)象的下一個(gè)元素
*/
function next() {
  return getNearEle(this, 0);
}
// var ele = document.getElementById("xxx");
// var prevElement = prev.call(ele);
// var nextElement = next.call(ele);

更多關(guān)于JavaScript節(jié)點(diǎn)操作相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript操作DOM技巧總結(jié)》

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

javascript中字符串處理常用的方法匯總
JavaScript中操作字符串是一個(gè)很重要的話題,下面這篇文章主要給大家介紹了關(guān)于javascript中字符串處理常用的方法,文中通過圖文以及代碼示例介紹的非常詳細(xì),需要的朋友可以參考下
2024-03-03
ionic 3.0+ 項(xiàng)目搭建運(yùn)行環(huán)境的教程
本篇文章主要介紹了ionic 3.0+ 項(xiàng)目搭建運(yùn)行的教程，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-08-08
js實(shí)現(xiàn)的Easy Tabs選項(xiàng)卡用法實(shí)例
這篇文章主要介紹了js實(shí)現(xiàn)的Easy Tabs選項(xiàng)卡用法,以完整實(shí)例形式較為詳細(xì)的分析了JavaScript鼠標(biāo)事件動(dòng)態(tài)操作頁面元素樣式的實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-09-09
js的OOP繼承實(shí)現(xiàn)(必看篇)
下面小編就為大家?guī)硪黄猨s的OOP繼承實(shí)現(xiàn)(必看篇)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-02-02
JavaScript 浮點(diǎn)數(shù)精度問題小結(jié)
浮點(diǎn)數(shù)精度問題是指在計(jì)算機(jī)中使用二進(jìn)制表示浮點(diǎn)數(shù)時(shí),由于二進(jìn)制無法精確表示某些十進(jìn)制小數(shù),本文主要介紹了JavaScript 浮點(diǎn)數(shù)精度問題,具有一定的參考價(jià)值,感興趣的可以了解一下
2025-02-02
7道關(guān)于JS this的面試題，你能答對(duì)幾個(gè)
這篇文章主要給大家介紹了7道關(guān)于JS this的面試題，來看看你能答對(duì)幾個(gè)，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2021-03-03
Javascript Function.prototype.bind詳細(xì)分析
這篇文章主要介紹了Javascript Function.prototype.bind詳細(xì)分析的相關(guān)資料,需要的朋友可以參考下
2016-12-12
JS仿Windows實(shí)現(xiàn)桌面主題特效
這篇文章主要介紹了如何利用HTML+CSS+JS模仿Windows實(shí)現(xiàn)桌面主題特效，文中的示例代碼講講詳細(xì)，感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下
2022-06-06
document.execCommand()的用法小結(jié)
本篇文章主要是對(duì)document.execCommand()的用法進(jìn)行了詳細(xì)的介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助
2014-01-01
JS實(shí)現(xiàn)簡(jiǎn)單的tab切換選項(xiàng)卡效果
這篇文章主要介紹了JS實(shí)現(xiàn)簡(jiǎn)單的tab切換選項(xiàng)卡效果,涉及javascript結(jié)合鼠標(biāo)事件對(duì)頁面元素屬性動(dòng)態(tài)操作的相關(guān)技巧,需要的朋友可以參考下
2016-09-09