jQuery中odd選擇器的定義和用法
本文實(shí)例講述了jQuery中odd選擇器的定義和用法。分享給大家供大家參考。具體分析如下:
此選擇器匹配索引值為奇數(shù)的元素,從0開(kāi)始計(jì)數(shù)。
語(yǔ)法結(jié)構(gòu):
此選擇器一般也要和其他選擇器配合使用,比如類選擇器、元素選擇器等等。例如:
以上代碼是將li元素集合中索引為奇數(shù)的li中的字體顏色設(shè)置為綠色。
如果沒(méi)有和其他選擇器配合使用,那么默認(rèn)和*選擇器配合使用。$(": odd")等同于$("*: odd")
實(shí)例代碼:
<!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:odd").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">點(diǎn)擊查看效果</button>
</body>
</html>
希望本文所述對(duì)大家的jQuery程序設(shè)計(jì)有所幫助。
相關(guān)文章
jQuery窗口拖動(dòng)功能的實(shí)現(xiàn)代碼
本文通過(guò)jquery代碼實(shí)現(xiàn)窗口拖動(dòng)功能以及jQuery 鼠標(biāo)拖拽移動(dòng)窗口的實(shí)現(xiàn)代碼,代碼簡(jiǎn)單易懂,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友參考下2017-02-02jQuery實(shí)現(xiàn)的動(dòng)態(tài)伸縮導(dǎo)航菜單實(shí)例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的動(dòng)態(tài)伸縮導(dǎo)航菜單,實(shí)例分析了jQuery鼠標(biāo)事件及animate、hide等方法的使用技巧,需要的朋友可以參考下2015-05-05jQuery判斷是否存在滾動(dòng)條的簡(jiǎn)單方法
下面小編就為大家?guī)?lái)一篇jQuery判斷是否存在滾動(dòng)條的簡(jiǎn)單方法。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-09-09用jQuery實(shí)現(xiàn)優(yōu)酷首頁(yè)輪播圖
本文主要介紹了用jQuery實(shí)現(xiàn)優(yōu)酷首頁(yè)輪播圖的思路與方法。具有一定的參考價(jià)值,下面跟著小編一起來(lái)看下吧2017-01-01如何使用jquery控制CSS樣式,并且取消Css樣式(如背景色,有實(shí)例)
使用jquery控制CSS樣式,并且取消Css樣式的一個(gè)簡(jiǎn)單小實(shí)例,需要的朋友可以參考下2013-07-07jQuery實(shí)現(xiàn)圖片預(yù)加載效果
這篇文章分享一款基于jQuery圖片預(yù)加載ydxLazyLoad.js代碼。這是一款基于ydxLazyLoad.js插件實(shí)現(xiàn)的圖片延遲加載特效,感興趣的小伙伴們可以參考一下2015-11-11jQuery實(shí)現(xiàn)廣告顯示和隱藏動(dòng)畫(huà)
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)廣告顯示和隱藏動(dòng)畫(huà),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-07-07