jQuery中:gt選擇器用法實例
更新時間：2014年12月29日 11:27:38 投稿：shichen2014
這篇文章主要介紹了jQuery中:gt選擇器用法,實例分析了:gt選擇器的功能、定義及匹配大于給定索引值元素的使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下
本文實例講述了jQuery中:gt選擇器用法。分享給大家供大家參考。具體分析如下：
此選擇器匹配所有索引值大于給定索引值的元素。
索引值最小是從0開始的。
語法結(jié)構(gòu):
復(fù)制代碼 代碼如下:
$(":gt(index)")
此選擇器一般也要和其他選擇器配合使用，比如類選擇器和元素選擇器等等。例如:
復(fù)制代碼 代碼如下:
$("li:gt(0)").css("color","blue")
以上代碼能夠?qū)⑺饕笥?的li元素中的字體顏色設(shè)置為綠色。
如果不和其他選擇器配合使用，則默認狀態(tài)是和*選擇器配合使用，例如$(":gt")等同于$("*:gt")。
參數(shù)列表:
實例代碼:
復(fù)制代碼 代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.dbjr.com.cn/" />
<title>腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#btn").click(function(){
$("li:gt(0)").css("color","blue");
})
})
</script>
</head>
<body>
<ul>
<li>html專區(qū)</li>
<li>div+css專區(qū)</li>
<li>jQuery專區(qū)</li>
<li>Javascript專區(qū)</li>
</ul>
<button id="btn">點擊查看效果</button>
</body>
</html>
以上代碼能夠?qū)i元素集合中索引值大于0的li元素中的字體顏色設(shè)置為藍色。
實例二:
復(fù)制代碼 代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.dbjr.com.cn/" />
<title>腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#btn").click(function(){
$(":gt(1)").css("color","blue");
});
});
</script>
</head>
<body>
<ul>
<li>html專區(qū)</li>
<li>div+css專區(qū)</li>
<li>jQuery專區(qū)</li>
<li>Javascript專區(qū)</li>
</ul>
<button id="btn">點擊查看效果</button>
</body>
</html>
由于以上代碼并沒有指定與:gt選擇器相配合使用的選擇器，所以就默認和*選擇器配合使用，于是以上代碼可以將當前文檔中所有元素中索引值大于1的元素中的字體顏色設(shè)置為藍色。
希望本文所述對大家的jQuery程序設(shè)計有所幫助。
相關(guān)文章
jQuery+PHP實現(xiàn)可編輯表格字段內(nèi)容并實時保存
在本例中，我們會通過jQuery實現(xiàn)單擊將一個文本信息變?yōu)榭删庉嫷谋韱危憧梢詫ξ谋緝?nèi)容進行編輯，然后點擊“確定”按鈕，新的內(nèi)容將發(fā)送到后臺PHP程序處理，并保存到數(shù)據(jù)庫；當點擊“取消”按鈕，則頁面恢復(fù)到初始狀態(tài)，需要的朋友可以參考下2015-10-10
有時候我們在前端開發(fā)工作中為了獲取圖片的信息，需要在圖片加載完成后才可以正確的獲取到圖片的大小尺寸，并且執(zhí)行相應(yīng)的回調(diào)函數(shù)使圖片產(chǎn)生某種顯示效果。本文主要整理了幾種常見的jquery判斷圖片加載完成時的方法2015-08-08
這篇文章主要介紹了jQuery插件實現(xiàn)大圖全屏圖片相冊的方法和示例，基于jQuery插件jQuery.album.js來實現(xiàn)的，效果非常不錯，這里推薦給大家，希望大家能夠喜歡。2015-03-03
這篇文章主要介紹了jQuery控制的不同方向的滑動(向左、向右滑動等),需要的朋友可以參考下2014-07-07
這篇文章主要介紹了jQuery限制輸入字符串長度的方法，實例講解，非常實用,需要的朋友可以參考下。2016-06-06
有時,要實現(xiàn)對于一篇文章的關(guān)鍵詞部分的提示,想實現(xiàn)的效果比如是,當鼠標移動到這個關(guān)鍵詞時,彈出相關(guān)的一段文字或圖片的介紹。2010-01-01
本篇文章主要是對jQuery選擇器進行了全面的總結(jié)介紹，需要的朋友可以過來參考下，希望對大家有所幫助2014-01-01
這篇文章主要介紹了JQuery顯示隱藏DIV的方法及代碼實例,本文講解了載入時隱藏、動態(tài)隱藏和顯示兩部分內(nèi)容,需要的朋友可以參考下2015-04-04
基于jQuery.validate及Bootstrap的tooltip開發(fā)氣泡樣式的表單校驗組件思路詳解
這篇文章主要介紹了基于jQuery.validate及Bootstrap的tooltip開發(fā)氣泡樣式的表單校驗組件的相關(guān)資料，非常不錯，具有參考借鑒價值，感興趣的朋友一起看下吧2016-07-07
這篇文章主要介紹了使用Jquery如何獲取帶特殊符號的ID 標簽，該怎么寫,需要的朋友可以參考下2014-04-04