jQuery獲取當前元素的上一個或者下一個元素代碼實例:本章節介紹一下如何獲取當前元素的上一個或者下一個元素,希望能夠給需要的朋友帶來幫助。代碼如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author"
jQuery獲取當前元素的上一個或者下一個元素代碼實例:
本章節介紹一下如何獲取當前元素的上一個或者下一個元素,希望能夠給需要的朋友帶來幫助。
代碼如下:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style type="text/css"> li{ list-style:none; font-size:12px; } </style> <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#pre").click(function(){ $("#show").text($("#box li").eq(2).prev().text()) }) $("#next").click(function(){ $("#show").text($("#box li").eq(2).next().text()) }) }) </script> </head> <body> <div id="show"></div> <ul id="box"> <li>螞蟻部落一</li> <li>螞蟻部落二</li> <li>螞蟻部落三</li> <li>螞蟻部落四</li> <li>螞蟻部落五</li> </ul> <input type="button" id="pre" value="獲取上一個元素"/> <input type="button" id="next" value="獲取下一個元素"/> </body> </html>
以上代碼實現了我們的要求,比較簡單,具體可以參閱相關閱讀。
相關閱讀:
1.text()函數jQuery的text()方法一章節。
2.eq()函數可以參閱jQuery的eq()方法一章節。
3.prev()函數可以參閱jQuery的prev()方法一章節。
4.next()函數可以參閱jQuery的next()方法一章節。
原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=13989
更多內容可以參閱:http://www.softwhy.com/jquery/