jQuery中odd选择器的定义和用法


Posted in Javascript onDecember 23, 2014

本文实例讲述了jQuery中odd选择器的定义和用法。分享给大家供大家参考。具体分析如下:

此选择器匹配索引值为奇数的元素,从0开始计数。
语法结构:

$(":odd")

此选择器一般也要和其他选择器配合使用,比如类选择器、元素选择器等等。例如:

$("li:odd)").css("color","green")

以上代码是将li元素集合中索引为奇数的li中的字体颜色设置为绿色。
如果没有和其他选择器配合使用,那么默认和*选择器配合使用。$(": odd")等同于$("*: odd")
实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<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专区</li>

  <li>div+css专区</li>

  <li>jQuery专区</li>

  <li>Javascript专区</li>

</ul>

<button id="btn">点击查看效果</button>

</body>

</html>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
JavaScript接口实现代码 (Interfaces In JavaScript)
Jun 11 Javascript
jWiard 基于JQuery的强大的向导控件介绍
Oct 28 Javascript
js实现通用的微信分享组件示例
Mar 10 Javascript
使用ngView配合AngularJS应用实现动画效果的方法
Jun 19 Javascript
Three.js学习之文字形状及自定义形状
Aug 01 Javascript
[原创]SyntaxHighlighter自动识别并加载脚本语言
Feb 07 Javascript
js实现鼠标拖动功能
Mar 20 Javascript
在Vue组件中获取全局的点击事件方法
Sep 06 Javascript
Vue监听一个数组id是否与另一个数组id相同的方法
Sep 26 Javascript
jquery实现动态添加附件功能
Oct 23 jQuery
jQuery 筛选器简单操作示例
Oct 02 jQuery
vue.js中ref及$refs的使用方法解析
Oct 08 Javascript
浅析javascript 定时器
Dec 23 #Javascript
JavaScript中自定义事件用法分析
Dec 23 #Javascript
jQuery中even选择器的定义和用法
Dec 23 #Javascript
javascript实现依次输入input自动定焦
Dec 23 #Javascript
使用原生JS实现弹出层特效
Dec 22 #Javascript
jQuery基础知识小结
Dec 22 #Javascript
jQuery异步获取json数据方法汇总
Dec 22 #Javascript
You might like
js限制checkbox勾选的个数以及php获取多个checkbbox的方法深入解析
2013/07/18 PHP
PHP实现采集中国天气网未来7天天气
2014/10/15 PHP
完美实现wordpress禁止文章修订和自动保存的方法
2014/11/03 PHP
php使用数组填充下拉列表框的方法
2015/03/31 PHP
smarty的section嵌套循环用法示例
2016/05/28 PHP
php json_encode与json_decode详解及实例
2016/12/13 PHP
解决Laravel无法使用COOKIE和SESSION的问题
2019/10/16 PHP
IE6、IE7中setAttribute不支持class/for/rowspan/colspan等属性
2011/08/28 Javascript
Document:getElementsByName()使用方法及示例
2013/10/28 Javascript
jquery实现图片翻页效果
2013/12/23 Javascript
JavaScript对象参数的引用传递
2016/01/14 Javascript
Javascript基础_嵌入图像的简单实现
2016/06/14 Javascript
浅谈javascript alert和confirm的美化
2016/12/15 Javascript
nodejs中全局变量的实例解析
2017/03/07 NodeJs
详解angular2实现ng2-router 路由和嵌套路由
2017/03/24 Javascript
微信小程序图片选择、上传到服务器、预览(PHP)实现实例
2017/05/11 Javascript
详解使用Node.js 将txt文件转为Excel文件
2017/07/05 Javascript
详解react-webpack2-热模块替换[HMR]
2017/08/03 Javascript
基于substring()和substr()的使用以及区别(实例讲解)
2017/12/28 Javascript
ajax请求+vue.js渲染+页面加载的示例
2018/02/11 Javascript
微信小程序控制台提示warning:Now you can provide attr &quot;wx:key&quot; for a &quot;wx:for&quot; to improve performance解决方法
2019/02/21 Javascript
vue-cli4项目开启eslint保存时自动格式问题
2020/07/13 Javascript
在vue中使用防抖函数组件操作
2020/07/26 Javascript
关于IDEA中的.VUE文件报错 Export declarations are not supported by current JavaScript version
2020/10/17 Javascript
python 获取本机ip地址的两个方法
2013/02/25 Python
Python常见排序操作示例【字典、列表、指定元素等】
2018/08/15 Python
python实现在线翻译
2020/06/18 Python
python遍历路径破解表单的示例
2020/11/21 Python
override和overload的区别
2016/03/09 面试题
物业管理专业个人的自我评价
2013/11/19 职场文书
军训的自我鉴定
2013/12/10 职场文书
鸿星尔克广告词
2014/03/21 职场文书
4s店销售经理岗位职责
2014/07/19 职场文书
2015年派出所工作总结
2015/04/24 职场文书
锦旗赠语
2015/06/23 职场文书
解决MySQL添加新用户-ERROR 1045 (28000)的问题
2022/03/03 MySQL