用jQuery獲取指定前幾個li元素程式碼例項
如果有一個li元素列表,可能我們有這樣的要求,那就是獲取指定的前幾個li元素,然後再進行指定的操作。
下面就通過程式碼例項介紹一下,如何利用jQuery實現此功能。
程式碼例項:
[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:150px; height:25px; line-height:25px; font-size:12px; } </style> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#bt").click(function(){ $("#box li:lt(2)").css("color","green"); }) }) </script> </head> <body> <ul id="box"> <li>螞蟻部落一</li> <li>螞蟻部落二</li> <li>螞蟻部落三</li> <li>螞蟻部落四</li> <li>螞蟻部落五</li> <li>螞蟻部落六</li> </ul> <input type="button" id="bt" value="檢視效果"/> </body> </html>
上面的程式碼可以獲取前兩個li元素,並將其字型顏色設定為綠色。
lt選擇器可以參閱jQuery :lt選擇器一章節。
相關文章
- jQuery獲取指定的li元素程式碼例項jQuery
- jquery如何獲取li元素的前n個程式碼例項jQuery
- 獲取指定元素下所有li元素程式碼例項
- jQuery獲取所有的li元素程式碼例項jQuery
- 獲取指定區間的li元素程式碼例項
- jQuery獲取指定元素的父元素程式碼例項jQuery
- 獲取當前li是第幾個的程式碼例項
- jquery刪除前n個li元素程式碼例項jQuery
- 使用jquery獲取指定元素的子元素程式碼例項jQuery
- jquery獲取指定li元素後面的第n個li元素jQuery
- jQuery獲取當前元素上一個兄弟元素例項程式碼jQuery
- jquery獲取指定型別子元素程式碼例項jQuery型別
- jquery獲取指定元素的父節點程式碼例項jQuery
- jquery獲取指定元素下所有指定子元素的數目程式碼例項jQuery
- javascript獲取li元素內容程式碼例項JavaScript
- jQuery獲取當前li元素的下一個元素jQuery
- javascript獲取指定元素父元素程式碼例項JavaScript
- jQuery獲取當前元素的上一級元素程式碼例項jQuery
- 獲取當前元素下一個元素程式碼例項
- jquery獲取元素高度程式碼例項jQuery
- jQuery獲取當前元素的上一個或者下一個元素程式碼例項jQuery
- jquery實現的獲取當前元素的上一個元素程式碼例項jQuery
- JavaScript獲取當前li元素是第幾個JavaScript
- css獲取指定元素的兄弟元素程式碼例項CSS
- jQuery獲取當前元素的下一級子元素程式碼例項jQuery
- css匹配指定行li元素程式碼例項CSS
- jQuery獲取指定型別最近的父輩元素程式碼例項jQuery型別
- 獲取倒數第幾個元素程式碼例項
- jquery獲取同輩元素程式碼例項jQuery
- jquery動態新增li元素程式碼例項jQuery
- js刪除指定的li元素程式碼例項JS
- jQuery實現的獲取m到n之間的li元素程式碼例項jQuery
- jquery如何獲取大於指定索引的li元素jQuery索引
- jQuery選擇器獲取前幾個元素jQuery
- jquery刪除指定元素程式碼例項jQuery
- jQuery調整li元素順序程式碼例項jQuery
- 在指定位置插入一個新的li元素程式碼例項
- jquery獲取元素的標籤tagName程式碼例項jQuery