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 setTimeout()传递函数参数(包括传递对象参数)
Apr 07 Javascript
表单元素的submit()方法和onsubmit事件应用概述
Feb 01 Javascript
innerHTML,outerHTML,innerText,outerText的用法及区别解析
Dec 16 Javascript
jquery.form.js用法之清空form的方法
Mar 07 Javascript
一款基jquery超炫的动画导航菜单可响应单击事件
Nov 02 Javascript
jQuery 重复加载错误以及修复方法
Dec 16 Javascript
AngularJs上传前预览图片的实例代码
Jan 20 Javascript
遍历json获得数据的几种方法小结
Jan 21 Javascript
微信小程序 引入es6 promise
Apr 12 Javascript
Angular Material Icon使用详解
Nov 07 Javascript
JS数据类型STRING使用实例解析
Dec 18 Javascript
es6函数中的作用域实例分析
Apr 18 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
web方式ftp
2006/10/09 PHP
PHP合并静态文件详解
2014/11/14 PHP
php将图片保存为不同尺寸图片的图片类实例
2015/03/30 PHP
php实现随机显示图片方法汇总
2015/05/21 PHP
Zend Framework教程之Zend_Db_Table_Row用法实例分析
2016/03/21 PHP
Thinkphp5框架ajax接口实现方法分析
2019/08/28 PHP
parseInt parseFloat js字符串转换数字
2010/08/01 Javascript
使用Javascript接收get传递的值的代码
2011/11/30 Javascript
详解强大的jQuery选择器之基本选择器、层次选择器
2012/02/07 Javascript
通过正则表达式实现表单验证是否为中文
2014/02/18 Javascript
基于Javascript实现二级联动菜单效果
2016/03/04 Javascript
JavaScript中的Number数字类型学习笔记
2016/05/26 Javascript
你不需要jQuery(三) 新AJAX方法fetch()
2016/06/14 Javascript
JavaScript实现的可变动态数字键盘控件方式实例代码
2017/07/15 Javascript
基于require.js的使用(实例讲解)
2017/09/07 Javascript
深入理解ES7的async/await的用法
2017/09/09 Javascript
react.js 父子组件数据绑定实时通讯的示例代码
2017/09/25 Javascript
layui 监听表格复选框选中值的方法
2018/08/15 Javascript
JS实现的类似微信聊天效果示例
2019/01/29 Javascript
js的继承方法小结(prototype、call、apply)(推荐)
2019/04/17 Javascript
JavaScript 异步时序问题
2020/11/20 Javascript
Python编程中对super函数的正确理解和用法解析
2016/07/02 Python
Python实现嵌套列表及字典并按某一元素去重复功能示例
2017/11/30 Python
Python生命游戏实现原理及过程解析(附源代码)
2019/08/01 Python
如何将 awk 脚本移植到 Python
2019/12/09 Python
Python实现ElGamal加密算法的示例代码
2020/06/19 Python
python中用ctypes模拟点击的实例讲解
2020/11/26 Python
CSS教程:CSS3圆角属性
2009/04/02 HTML / CSS
中国包裹转运寄送国际服务:Famiboat
2019/07/24 全球购物
家具促销活动方案
2014/02/16 职场文书
《狼》教学反思
2014/03/02 职场文书
副处级干部考察材料
2014/05/17 职场文书
校优秀毕业生主要事迹
2014/05/26 职场文书
团队执行力培训心得体会
2015/08/15 职场文书
Python爬虫框架之Scrapy中Spider的用法
2021/06/28 Python
MySQL常用慢查询分析工具详解
2022/08/14 MySQL