jQuery中odd选择器的定义和用法
本文实例讲述了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="http://www.jb51.net/" />
<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程序设计有所帮助。
相关推荐
-
jquery选择器需要注意的问题
我们先来看段代码,很简单,如下 复制代码 代码如下: <div id="div1"> <span>111</span> <span>222</span> <span>333</span> <button id="button1">clear</button> </div> 复制代码 代码如下: $(function(
-
jQuery选择器全集详解
选择器是jQuery最基础的东西,本文中列举的选择器基本上囊括了所有的jQuery选择器,也许各位通过这篇文章能够加深对jQuery选择器 的理解,它们本身用法就非常简单,我更希望的是它能够提升个人编写jQuery代码的效率.本文配合截图.代码和简单的概括对所有jQuery选择器进行 了介绍,也列举出了一些需要注意和区分的地方. 一.基本选择器 1. id选择器(指定id元素) 将id="one"的元素背景色设置为黑色.(id选择器返单个元素) $(document).ready(fu
-
jQuery分组选择器用法实例
本文实例讲述了jQuery分组选择器用法.分享给大家供大家参考.具体分析如下: 分组选择器将每一个选择器匹配到的元素合并后一起返回,能够对它们进行相同的操作. 实例代码: 复制代码 代码如下: $(".mydiv ,span") 以上代码能够匹配类名为mydiv的元素和所有的span元素.两个选择器之间要用逗号分割. 实例代码: 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta charset=&qu
-
jQuery中:gt选择器用法实例
本文实例讲述了jQuery中:gt选择器用法.分享给大家供大家参考.具体分析如下: 此选择器匹配所有索引值大于给定索引值的元素. 索引值最小是从0开始的. 语法结构: 复制代码 代码如下: $(":gt(index)") 此选择器一般也要和其他选择器配合使用,比如类选择器和元素选择器等等.例如: 复制代码 代码如下: $("li:gt(0)").css("color","blue") 以上代码能够将索引大于0的li元素中的字体
-
jQuery元素选择器用法实例
本文实例讲述了jQuery元素选择器用法.分享给大家供大家参考.具体分析如下: 元素选择器根据元素名称匹配所有的元素. 实例代码: 复制代码 代码如下: $("div") 以上代码匹配所有的div元素. 实例代码: 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author&quo
-
jQuery中:eq()选择器用法实例
本文实例讲述了jQuery中:eq()选择器用法.分享给大家供大家参考.具体分析如下: 此选择器匹配一个给定索引值的元素. 元素的位置索引从0算起. 语法结构: 复制代码 代码如下: $(":eq(index)") 此选择器一般也要和其他选择器配合使用,比如类选择器和元素选择器等等.例如: 复制代码 代码如下: $("li:eq(1)").css("color","green") 以上代码是将li元素集合中索引为1(也就是第二
-
jQuery中even选择器的定义和用法
本文实例讲述了jQuery中even选择器的定义和用法.分享给大家供大家参考.具体分析如下: 此选择器匹配所有索引值为偶数的元素,从0开始计数. 语法结构: 复制代码 代码如下: $(":even") 此选择器一般也要和其他选择器配合使用,比如类选择器.元素选择器等等. 例如: 复制代码 代码如下: $("li:even)").css("color","green") 以上代码是将li元素集合中索引为偶数的li中的字体颜色设置
-
jQuery中:lt选择器用法实例
本文实例讲述了jQuery中:lt选择器用法.分享给大家供大家参考.具体分析如下: 此选择器匹配所有小于给定索引值的元素. 索引值最小是从0开始的. 语法结构: 复制代码 代码如下: $(":lt(index)") 此选择器一般也要和其他选择器配合使用,比如类选择器和元素选择器等等. 例如: 复制代码 代码如下: $("li:lt(3)").css("color","blue") 以上代码能够将索引小于3的li元素中的字体颜色
-
jQuery中element选择器用法实例
本文实例讲述了jQuery中element选择器用法.分享给大家供大家参考.具体分析如下: 此选择器能够匹配具有指定标签名的元素.例如: 复制代码 代码如下: $("div") 以上代码能够选取所有的div元素. 语法结构: 复制代码 代码如下: $(element) 参数列表: 参数 描述 element 一个用于搜索的元素.指向DOM节点的标签名. 实例代码: 复制代码 代码如下: <!DOCTYPE HTML> <html> <head> &l
-
jQuery类选择器用法实例
本文实例讲述了jQuery类选择器用法.分享给大家供大家参考.具体分析如下: 类选择的器匹配具有指定类名的所有元素. 例子: 复制代码 代码如下: $(".mydiv") 以上代码选取类名为mydiv的所有元素. 注意:在mydiv前面有一点(.). 实例代码: 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name=
-
jQuery后代选择器用法实例
本文实例讲述了jQuery后代选择器用法.分享给大家供大家参考.具体分析如下: 后代选择器匹配给定的祖先元素下用以匹配的所有后代元素. 点击选择器可以查阅参考手册中所有jQuery选择器. 代码实例如下: 复制代码 代码如下: $(".mydiv span") 以上代码匹配类名mydiv元素包含的span元素.两个选择器之间要用空格分隔. 实例代码: 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta
随机推荐
- Angular.js中ng-if、ng-show和ng-hide的区别介绍
- 用hta[javascript]写的定时重启或关机的小工具
- JavaScript中的Array对象使用说明
- linux NFS 学习笔记
- 浅谈java 字符串,字符数组,list间的转化
- iOS下PDF文件的浏览和涂鸦效果的简单实现
- PHP的Yii框架中行为的定义与绑定方法讲解
- 为自己的ASP网站系统构建一套标记语言
- PHP Filter过滤器全面解析
- php通过正则表达式记取数据来读取xml的方法
- destoon实现调用热门关键字的方法
- 很实用的js选项卡切换效果
- jQuery插件bgStretcher.js实现全屏背景特效
- jQuery版仿Path菜单效果
- jQuery 3 中的新增功能汇总介绍
- php面向对象全攻略 (十六) 对象的串行化
- C#把UNICODE编码转换为GB编码的实例
- mysql之explain使用详解(分析索引)
- JS动画定时器知识总结
- Python求解任意闭区间的所有素数