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 相关文章推荐
探讨js中的双感叹号判断
Nov 11 Javascript
javascript实现倒计时N秒后网页自动跳转代码
Dec 11 Javascript
JavaScript中的replace()方法使用详解
Jun 06 Javascript
莱鸟介绍javascript onclick事件
Jan 06 Javascript
jQuery鼠标悬浮链接弹出跟随图片实例代码
Jan 08 Javascript
有关easyui-layout中的收缩层无法显示标题的解决办法
May 10 Javascript
JS新包管理工具yarn和npm的对比与使用入门
Dec 09 Javascript
微信小程序开发入门基础教程
Apr 19 Javascript
vue element动态渲染、移除表单并添加验证的实现
Jan 16 Javascript
Vue递归组件+Vuex开发树形组件Tree--递归组件的简单实现
Apr 01 Javascript
vue开发移动端底部导航条功能
Apr 08 Javascript
JQuery通过键盘控制键盘按下与松开触发事件
Aug 07 jQuery
浅析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伪静态之APACHE篇
2014/06/02 PHP
浅谈PHP正则表达式中修饰符/i, /is, /s, /isU
2014/10/21 PHP
关于PHP开发的9条建议
2015/07/27 PHP
getElementsByTagName vs selectNodes效率 及兼容的selectNodes实现
2010/02/26 Javascript
js插件方式打开pdf文件(浏览器pdf插件分享)
2013/12/20 Javascript
Javascript学习笔记之 函数篇(三) : 闭包和引用
2014/11/23 Javascript
浅析Node.js中的内存泄漏问题
2015/06/23 Javascript
javascript实现10个球随机运动、碰撞实例详解
2015/07/08 Javascript
jQuery判断浏览器并动态调整select宽度的方法
2016/03/02 Javascript
js判断checkbox是否选中个数的方法(超简单)
2016/08/19 Javascript
javascript显示系统当前时间代码
2016/12/29 Javascript
微信小程序组件 contact-button(客服会话按钮)详解及实例代码
2017/01/10 Javascript
使用jquery给新生的th绑定hover事件的实例
2017/02/10 Javascript
js实现登录框鼠标拖拽效果
2017/03/09 Javascript
教你5分钟学会用requirejs(必看篇)
2017/07/25 Javascript
JS原生带缩略图的图片切换效果
2018/10/10 Javascript
详解vue 项目白屏解决方案
2018/10/31 Javascript
vue-cli3搭建项目的详细步骤
2018/12/05 Javascript
js控制随机数生成概率代码实例
2019/03/21 Javascript
Python实现ssh批量登录并执行命令
2016/10/25 Python
解决每次打开pycharm直接进入项目的问题
2018/10/28 Python
详解python3安装pillow后报错没有pillow模块以及没有PIL模块问题解决
2019/04/17 Python
Python绘图实现显示中文
2019/12/04 Python
Python HTMLTestRunner可视化报告实现过程解析
2020/04/10 Python
详解HTML5 录音的踩坑之旅
2017/12/26 HTML / CSS
韩国休闲女装品牌网站:ANAIS
2016/08/24 全球购物
德国隐形眼镜店:LuckyLens
2018/07/29 全球购物
雷曼兄弟的五金店:Lehman’s Hardware Store
2019/04/10 全球购物
什么是Assembly(程序集)
2014/09/14 面试题
学生档案自我鉴定
2013/10/07 职场文书
入党自我评价范文
2014/02/02 职场文书
科研课题实施方案
2014/03/18 职场文书
学习雷锋演讲稿
2014/05/10 职场文书
家庭财产分割协议范文
2014/11/24 职场文书
Mysql systemctl start mysqld报错的问题解决
2021/06/03 MySQL
instantclient客户端 连接oracle数据库
2022/04/26 Oracle