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 相关文章推荐
jQuery获取CSS样式中的颜色值的问题,不同浏览器格式不同的解决办法
May 13 Javascript
jQuery 全选/反选以及单击行改变背景色实例
Jul 02 Javascript
实用框架(iframe)操作代码
Oct 23 Javascript
node.js抓取并分析网页内容有无特殊内容的js文件
Nov 17 Javascript
JS仿百度自动下拉框模糊匹配提示
Jul 25 Javascript
如何用js判断dom是否有存在某class的值
Feb 13 Javascript
自定义vue全局组件use使用、vuex的使用详解
Jun 14 Javascript
webpack组织模块打包Library的原理及实现
Mar 10 Javascript
详解webpack-dev-server的简单使用
Apr 02 Javascript
使用Vue自定义指令实现Select组件
May 24 Javascript
通过vue写一个瀑布流插件代码实例
Sep 07 Javascript
vue-cli+iview项目打包上线之后图标不显示问题及解决方法
Oct 16 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
php中多维数组按指定value排序的实现代码
2014/08/19 PHP
了解jQuery技巧来提高你的代码
2010/01/08 Javascript
IE6下通过a标签点击切换图片的问题
2010/11/14 Javascript
jQuery实现id模糊查询的小例子
2013/03/19 Javascript
可兼容IE的获取及设置cookie的jquery.cookie函数方法
2013/09/02 Javascript
图片上传插件jquery.uploadify详解
2013/11/15 Javascript
JS父页面与子页面相互传值方法
2014/03/05 Javascript
jQuery实现的淡入淡出二级菜单效果代码
2015/09/15 Javascript
JS实现带鼠标效果的头像及文章列表代码
2015/09/27 Javascript
13个PHP函数超实用
2015/10/21 Javascript
JavaScript表单验证实例之验证表单项是否为空
2016/01/10 Javascript
JavaScript异步上传图片文件的实例代码
2017/07/04 Javascript
通过源码分析Vue的双向数据绑定详解
2017/09/24 Javascript
electron demo项目npm install安装失败的解决方法
2018/02/06 Javascript
postman+json+springmvc测试批量添加实例
2018/03/31 Javascript
微信小程序input框中加入小图标的实现方法
2018/06/19 Javascript
JS使用百度地图API自动获取地址和经纬度操作示例
2019/04/16 Javascript
vue 项目build错误异常的解决方法
2019/04/22 Javascript
Node.js API详解之 tty功能与用法实例分析
2020/04/27 Javascript
Python对小数进行除法运算的正确方法示例
2014/08/25 Python
Python正则表达式经典入门教程
2017/05/22 Python
django创建自定义模板处理器的实例详解
2017/08/14 Python
selenium+python实现自动化登录的方法
2018/09/04 Python
python Django 创建应用过程图示详解
2019/07/29 Python
python 的 openpyxl模块 读取 Excel文件的方法
2019/09/09 Python
Python.append()与Python.expand()用法详解
2019/12/18 Python
Python+Django+MySQL实现基于Web版的增删改查的示例代码
2020/05/13 Python
Python环境搭建过程从安装到Hello World
2021/02/05 Python
九年级物理教学反思
2014/01/29 职场文书
工作睡觉检讨书
2014/02/25 职场文书
元旦获奖感言
2014/03/08 职场文书
《迟到》教学反思
2016/02/24 职场文书
如何起草一份正确的合伙创业协议书?
2019/07/04 职场文书
中国古代史学名著《战国策》概述
2019/08/09 职场文书
Mysql数据库手动及定时备份步骤
2021/11/07 MySQL
Python OpenCV超详细讲解调整大小与图像操作的实现
2022/04/02 Python