jQuery中odd選擇器的定義和用法
更新時間：2014年12月23日 09:36:59 投稿：shichen2014
這篇文章主要介紹了jQuery中odd選擇器的定義和用法,較為詳細(xì)的分析了odd選擇器的具體功能、定義與使用方法,具有一定的參考借鑒價值,需要的朋友可以參考下
本文實例講述了jQuery中odd選擇器的定義和用法。分享給大家供大家參考。具體分析如下：
此選擇器匹配索引值為奇數(shù)的元素，從0開始計數(shù)。
語法結(jié)構(gòu):
復(fù)制代碼 代碼如下:
$(":odd")
此選擇器一般也要和其他選擇器配合使用，比如類選擇器、元素選擇器等等。例如:
復(fù)制代碼 代碼如下:
$("li:odd)").css("color","green")
以上代碼是將li元素集合中索引為奇數(shù)的li中的字體顏色設(shè)置為綠色。
如果沒有和其他選擇器配合使用，那么默認(rèn)和*選擇器配合使用。$(": odd")等同于$("*: odd")
實例代碼:
復(fù)制代碼 代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://chabaoo.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>
希望本文所述對大家的jQuery程序設(shè)計有所幫助。
相關(guān)文章
本文通過jquery代碼實現(xiàn)窗口拖動功能以及jQuery 鼠標(biāo)拖拽移動窗口的實現(xiàn)代碼，代碼簡單易懂，非常不錯，具有參考借鑒價值，需要的朋友參考下2017-02-02
jQuery實現(xiàn)的動態(tài)伸縮導(dǎo)航菜單實例
這篇文章主要介紹了jQuery實現(xiàn)的動態(tài)伸縮導(dǎo)航菜單,實例分析了jQuery鼠標(biāo)事件及animate、hide等方法的使用技巧,需要的朋友可以參考下2015-05-05
下面小編就為大家?guī)硪黄猨Query判斷是否存在滾動條的簡單方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-09-09
本文主要介紹了用jQuery實現(xiàn)優(yōu)酷首頁輪播圖的思路與方法。具有一定的參考價值，下面跟著小編一起來看下吧2017-01-01
如何使用jquery控制CSS樣式,并且取消Css樣式(如背景色,有實例)
使用jquery控制CSS樣式,并且取消Css樣式的一個簡單小實例，需要的朋友可以參考下2013-07-07
這篇文章主要介紹了thinkphp 表名 大小寫 竅門,需要的朋友可以參考下2015-02-02
這篇文章主要介紹了JQuery解析XML的方法,總結(jié)分析了常用的jQuery解析xml文件的相關(guān)技巧,需要的朋友可以參考下2016-04-04
這篇文章分享一款基于jQuery圖片預(yù)加載ydxLazyLoad.js代碼。這是一款基于ydxLazyLoad.js插件實現(xiàn)的圖片延遲加載特效，感興趣的小伙伴們可以參考一下2015-11-11
這篇文章主要為大家詳細(xì)介紹了jQuery實現(xiàn)廣告顯示和隱藏動畫，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-07-07
表格增行刪行一般情況下都是通過修改html結(jié)構(gòu)實現(xiàn)的，接下來為大家介紹下如何使用jquery實現(xiàn)表格增行刪行，感興趣的各位可不要錯過了哈2013-03-03