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


Posted in Javascript onDecember 23, 2014

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

此选择器匹配所有索引值为偶数的元素,从0开始计数。

语法结构:

$(":even")

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

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

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

<!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:even").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>

以上代码可以将索引值为偶数的li元素中的字体颜色设置为蓝色。

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

Javascript 相关文章推荐
关于用Jquery的height()、width()计算动态插入的IMG标签的宽高的问题
Dec 08 Javascript
A标签触发onclick事件而不跳转的多种解决方法
Jun 27 Javascript
Lua表达式和控制结构学习笔记
Dec 15 Javascript
10条建议帮助你创建更好的jQuery插件
May 18 Javascript
理解javascript封装
Feb 23 Javascript
JavaScript正则表达式匹配 div  style标签
Mar 15 Javascript
bootstrap 模态框(modal)实现水平垂直居中显示
Jan 23 Javascript
jQuery实现动态控制页面元素的方法分析
Dec 20 jQuery
Vue 之孙组件向爷组件通信的实现
Apr 23 Javascript
vue操作动画的记录animate.css实例代码
Apr 26 Javascript
解决vue的touchStart事件及click事件冲突问题
Jul 21 Javascript
浅析JavaScript 函数柯里化
Sep 08 Javascript
javascript实现依次输入input自动定焦
Dec 23 #Javascript
使用原生JS实现弹出层特效
Dec 22 #Javascript
jQuery基础知识小结
Dec 22 #Javascript
jQuery异步获取json数据方法汇总
Dec 22 #Javascript
jQuery的观察者模式详解
Dec 22 #Javascript
使用jQuery和Bootstrap实现多层、自适应模态窗口
Dec 22 #Javascript
sails框架的学习指南
Dec 22 #Javascript
You might like
PHP has encountered an Access Violation at 7C94BD02解决方法
2009/08/24 PHP
php实现的简易扫雷游戏实例
2015/07/09 PHP
jQuery ui 1.7更新小结
2009/08/15 Javascript
仅IE6/7/8中innerHTML返回值忽略英文空格的问题
2011/04/07 Javascript
jQuery中json对象的复制方式介绍(数组及对象)
2013/06/08 Javascript
Js,alert出现乱码问题的解决方法
2013/06/19 Javascript
用js来获取上传的文件名纯粹是为了美化而用
2013/10/23 Javascript
三种检测iPhone/iPad设备方向的方法
2014/04/23 Javascript
jquery动态分页效果堪比时光网
2014/09/25 Javascript
轻松实现js弹框显示选项
2016/09/13 Javascript
解决vue单页使用keep-alive页面返回不刷新的问题
2018/03/13 Javascript
p5.js入门教程之小球动画示例代码
2018/03/15 Javascript
Less 安装及基本用法
2018/05/05 Javascript
webpack的CSS加载器的使用
2018/09/11 Javascript
nodejs语言实现验证码生成功能的示例代码
2019/10/13 NodeJs
Vue防止白屏添加首屏动画的实例
2019/10/31 Javascript
[48:44]2014 DOTA2国际邀请赛中国区预选赛5.21 TongFu VS HGT
2014/05/22 DOTA
python strip()函数 介绍
2013/05/24 Python
解决Python中由于logging模块误用导致的内存泄露
2015/04/23 Python
Python实现基本线性数据结构
2016/08/22 Python
Python yield 使用方法浅析
2017/05/20 Python
Python网络爬虫中的同步与异步示例详解
2018/02/03 Python
python使用TensorFlow进行图像处理的方法
2018/02/28 Python
为什么说Python可以实现所有的算法
2019/10/04 Python
python 一维二维插值实例
2020/04/22 Python
Css3实现无缝滚动防抖
2020/09/14 HTML / CSS
BNKR中国官网:带你感受澳洲领先潮流时尚
2018/08/21 全球购物
Shell如何接收变量输入
2016/08/06 面试题
授权委托书样本
2014/04/03 职场文书
尊师重教演讲稿
2014/09/04 职场文书
机关作风整顿个人整改措施2014
2014/09/17 职场文书
先进工作者个人总结
2015/02/15 职场文书
2015年学习部工作总结范文
2015/03/31 职场文书
2015年秋季学校开学标语
2015/07/16 职场文书
关于办理居住证的介绍信模板
2019/11/27 职场文书
开发微信小程序之WXSS样式教程
2022/04/18 HTML / CSS