獲取當前元素下一個元素程式碼例項
本章節介紹一下如何獲取當前元素的下一個元素。
程式碼例項如下:
[HTML] 純文字檢視 複製程式碼<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style type="text/css"> #box li { width: 350px; height: 25px; line-height: 25px; font-size: 12px; } </style> <script type="text/javascript"> function getNextEle(obj) { if (obj.nextSibling != "undefined") { if (obj.nextSibling.nodeType == 1) { return obj.nextSibling; } else { return arguments.callee(obj.nextSibling); } } else { return null } } window.onload = function () { var oli = document.getElementById("antzone"); var nextEle = getNextEle(oli); alert(nextEle.innerHTML); } </script> </head> <body> <ul id="box"> <li>螞蟻部落歡迎您,只有努力才會有美好的未來</li> <li id="antzone">每一天都是新的,必須要好好把握。</li> <li>沒有人一開始就是高手,必須要努力奮鬥。</li> <li>未來都是虛無縹緲的,只有當前是現實。</li> <li>分享和互助式進步的最大原動力</li> <li>本站的url地址是www.softwhy.com。</li> </ul> </body> </html>
上面的程式碼實現了我們的要求,下面介紹一下它的實現過程。
一.程式碼註釋:
(1).function getNextEle(obj) {},此方法實現了主要功能,obj引數就是規定要獲取哪一個元素的下一個元素。
(2).if (obj.nextSibling != "undefined"),判斷當前元素的下一個節點是否為undefined。
(3).if (obj.nextSibling.nodeType == 1) {
return obj.nextSibling;
},如果節點的型別,為元素節點,那麼就返回此節點。
(4).else {
return arguments.callee(obj.nextSibling);
},否則遞迴查詢下一個節點的下一個節點。
二.相關閱讀:
(1).nextSibling屬性可以參閱javascript nextSibling一章節。
(2).nodeType屬性可以參閱js nodeType一章節。
(3).innerHTML可以參閱innerHTML一章節。
相關文章
- jQuery獲取當前元素的下一級子元素程式碼例項jQuery
- jQuery獲取當前元素的上一個或者下一個元素程式碼例項jQuery
- jQuery獲取當前元素上一個兄弟元素例項程式碼jQuery
- jQuery獲取當前元素的下一個元素jQuery
- jQuery獲取當前元素的上一級元素程式碼例項jQuery
- jquery實現的獲取當前元素的上一個元素程式碼例項jQuery
- jQuery獲取當前li元素的下一個元素jQuery
- 用jQuery獲取指定前幾個li元素程式碼例項jQuery
- jquery如何獲取li元素的前n個程式碼例項jQuery
- javascript獲取指定元素父元素程式碼例項JavaScript
- jQuery獲取指定元素的父元素程式碼例項jQuery
- css獲取指定元素的兄弟元素程式碼例項CSS
- 獲取指定元素下所有li元素程式碼例項
- jquery獲取元素高度程式碼例項jQuery
- 獲取倒數第幾個元素程式碼例項
- 使用jquery獲取指定元素的子元素程式碼例項jQuery
- jquery獲取同輩元素程式碼例項jQuery
- javascript獲取元素封裝程式碼例項JavaScript封裝
- jQuery如何獲取當前元素的兄弟元素jQuery
- JQuery獲取當前元素本身jQuery
- javascript實現的獲取下一個li元素程式碼例項JavaScript
- js獲取當前月份例項程式碼JS
- jQuery獲取指定的li元素程式碼例項jQuery
- jQuery獲取所有的li元素程式碼例項jQuery
- javascript獲取元素的順序程式碼例項JavaScript
- javascript獲取li元素內容程式碼例項JavaScript
- 原生javascript獲取下一級子元素程式碼例項JavaScript
- javascript獲取當前元素的上一級元素JavaScript
- 獲取當前li是第幾個的程式碼例項
- JavaScript獲取當前li元素是第幾個JavaScript
- jquery獲取指定型別子元素程式碼例項jQuery型別
- jquery獲取元素的標籤tagName程式碼例項jQuery
- js獲取頁面中所有元素程式碼例項JS
- 獲取指定區間的li元素程式碼例項
- js獲取元素的實際尺寸程式碼例項JS
- jquery刪除前n個li元素程式碼例項jQuery
- 實時獲取當前時間程式碼例項
- 原生javascript實現獲取指定元素下所有後代元素程式碼例項JavaScript