jQuery分组选择器用法实例


Posted in Javascript onDecember 23, 2014

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

分组选择器将每一个选择器匹配到的元素合并后一起返回,能够对它们进行相同的操作。

实例代码:

$(".mydiv ,span")

以上代码能够匹配类名为mydiv的元素和所有的span元素。两个选择器之间要用逗号分割。
实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title>

<style type="text/css">

div{

  height:150px;

  width:150px;

  background-color:green;

  margin-top:10px;

}

</style>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript"> 

$(document).ready(function(){ 

  $("button").click(function(){ 

    $(".mydiv ,span").css("color","red"); 

  }) 

}) 

</script>

</head>

<body>

  <div class="mydiv">三水点靠木</div>

  <span>三水点靠木欢迎您</span>

  <button>点击查看效果</button>

</body>

</html>

以上代码可以将类名为mydiv的div和span中的字体颜色设置为红色。

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

Javascript 相关文章推荐
IE6下通过a标签点击切换图片的问题
Nov 14 Javascript
Jquery中LigerUi的弹出编辑框(实现方法)
Jul 09 Javascript
FireBug 调试JS入门教程 如何调试JS
Dec 23 Javascript
javascript动态判断html元素并执行不同的操作
Jun 16 Javascript
javascript面向对象快速入门实例
Jan 13 Javascript
基于JavaScript代码实现微信扫一扫下载APP
Dec 30 Javascript
浅谈js控制li标签排序问题 js调用php函数的方法
Oct 16 Javascript
Javascript中关于Array.filter()的妙用详解
Dec 04 Javascript
一次围绕setTimeout的前端面试经验分享
Jun 15 Javascript
微信小程序自定义组件的实现方法及自定义组件与页面间的数据传递问题
Oct 09 Javascript
微信小程序如何通过用户授权获取手机号(getPhoneNumber)
Jan 21 Javascript
JavaScript简单编程实例学习
Feb 14 Javascript
常用的JS验证和函数汇总
Dec 23 #Javascript
jQuery后代选择器用法实例
Dec 23 #Javascript
浅析Javascript中“==”与“===”的区别
Dec 23 #Javascript
javascript实现微信分享
Dec 23 #Javascript
JSON取值前判断
Dec 23 #Javascript
jQuery基础语法实例入门
Dec 23 #Javascript
jQuery回调函数的定义及用法实例
Dec 23 #Javascript
You might like
web目录下不应该存在多余的程序(安全考虑)
2012/05/09 PHP
使用cookie实现统计访问者登陆次数
2013/06/08 PHP
sql注入与转义的php函数代码
2013/06/17 PHP
解析Win7 XAMPP apache无法启动的问题
2013/06/26 PHP
Laravel 5框架学习之子视图和表单复用
2015/04/09 PHP
Thinkphp单字母函数使用指南
2016/05/08 PHP
Windows2003下php5.4安装配置教程(IIS)
2016/06/30 PHP
PHP实现绘制二叉树图形显示功能详解【包括二叉搜索树、平衡树及红黑树】
2017/11/16 PHP
javascript游戏开发之《三国志曹操传》零部件开发(一)让静态人物动起来
2013/01/23 Javascript
jQuery基础语法实例入门
2014/12/23 Javascript
js实现鼠标触发图片抖动效果的方法
2015/02/27 Javascript
使用CamanJS在Web页面上处理图像的技巧
2015/08/18 Javascript
JavaScript实现99乘法表及隔行变色实例代码
2016/02/24 Javascript
BootStrap glyphicons 字体图标实现方法
2016/05/01 Javascript
深入理解js函数的作用域与this指向
2016/05/28 Javascript
Angular.js中用ng-repeat-start实现自定义显示
2016/10/18 Javascript
JavaScript中Array对象用法实例总结
2016/11/29 Javascript
Es6 写的文件import 起来解决方案详解
2016/12/13 Javascript
浅谈Angular.js中使用$watch监听模型变化
2017/01/10 Javascript
js中apply和Math.max()函数的问题及区别介绍
2018/03/27 Javascript
使用Angular Cli如何创建Angular私有库详解
2019/01/30 Javascript
vue实现局部刷新的实现示例
2019/04/16 Javascript
小程序实现分类页
2019/07/12 Javascript
nodejs对项目下所有空文件夹创建gitkeep的方法
2019/08/02 NodeJs
vue 实现购物车总价计算
2019/11/06 Javascript
[01:06:54]DOTA2-DPC中国联赛 正赛 RNG vs Dragon BO3 第一场 1月24日
2021/03/11 DOTA
python实现mysql的单引号字符串过滤方法
2015/11/14 Python
python用match()函数爬数据方法详解
2019/07/23 Python
Python实现手绘图效果实例分享
2020/07/22 Python
茱莉蔻美国官网:Jurlique美国
2020/11/24 全球购物
公益广告语集锦
2014/03/13 职场文书
先进个人申报材料
2014/12/30 职场文书
贫困生助学金感谢信
2015/01/21 职场文书
高中生社会实践心得体会
2016/01/14 职场文书
教师信息技术学习心得体会
2016/01/21 职场文书
MySQL系列之十五 MySQL常用配置和性能压力测试
2021/07/02 MySQL