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 相关文章推荐
IE中radio 或checkbox的checked属性初始状态下不能选中显示问题
Jul 25 Javascript
IE6、IE7中获取Button元素的值的bug说明
Aug 28 Javascript
Jquery中offset()和position()的区别分析
Feb 05 Javascript
javascript 利用arguments实现可变长参数
Nov 21 Javascript
webpack打包js的方法
Mar 12 Javascript
Vue利用canvas实现移动端手写板的方法
May 03 Javascript
使用Vue中 v-for循环列表控制按钮隐藏显示功能
Apr 23 Javascript
泛谈JS逻辑判断选择器 || &amp;&amp;
May 24 Javascript
微信小程序 腾讯地图显示偏差问题解决
Jul 27 Javascript
Javascript Worker子线程代码实例
Feb 20 Javascript
jquery制作的移动端购物车效果完整示例
Feb 24 jQuery
在react中使用vue的状态管理的方法示例
May 02 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
将数字格式的计算结果转为汉字格式
2006/10/09 PHP
PHP新手上路(三)
2006/10/09 PHP
隐藏X-Space个人空间下方版权方法隐藏X-Space个人空间标题隐藏X-Space个人空间管理版权方法
2007/02/22 PHP
PHP filter_var() 函数 Filter 函数
2012/04/25 PHP
PHP函数addslashes和mysql_real_escape_string的区别
2014/04/22 PHP
一个完整的PHP类包含的七种语法说明
2015/06/04 PHP
thinkphp3.x中session方法的用法分析
2016/05/20 PHP
laravel实现上传图片,并且制作缩略图,按照日期存放的代码
2019/10/16 PHP
JavaScript 原型与继承说明
2010/06/09 Javascript
自用js开发框架小成 学习js的朋友可以看看
2010/11/16 Javascript
JavaScript回调(callback)函数概念自我理解及示例
2013/07/04 Javascript
jquery设置元素的readonly和disabled的写法
2013/09/22 Javascript
JavaScript在Android的WebView中parseInt函数转换不正确问题解决方法
2015/04/25 Javascript
jQuery利用FormData上传文件实现批量上传
2018/12/04 jQuery
详解如何理解vue的key属性
2019/04/14 Javascript
vue2.0 获取从http接口中获取数据,组件开发,路由配置方式
2019/11/04 Javascript
浅谈js中的attributes和Attribute的用法与区别
2020/07/16 Javascript
[04:28]2014DOTA2国际邀请赛 采访小兔子LGD挺进钥匙体育馆
2014/07/14 DOTA
[00:02]DOTA2新版本使用PA至宝后暴击展示
2014/11/19 DOTA
python网络编程之UDP通信实例(含服务器端、客户端、UDP广播例子)
2014/04/25 Python
Python操作MySQL数据库9个实用实例
2015/12/11 Python
[原创]教女朋友学Python3(二)简单的输入输出及内置函数查看
2017/11/30 Python
python的slice notation的特殊用法详解
2019/12/27 Python
Python脚本如何在bilibili中查找弹幕发送者
2020/06/04 Python
解决pycharm修改代码后第一次运行不生效的问题
2021/02/06 Python
css3和jquery实现的可折叠导航菜单适合放在手机网页的导航菜单
2014/09/02 HTML / CSS
全球领先的中国制造商品在线批发平台:DHgate
2020/01/28 全球购物
贪睡宠物用品:Snoozer Pet Products
2020/02/04 全球购物
医学专业毕业生推荐信
2013/11/14 职场文书
商场端午节活动方案
2014/01/29 职场文书
调解员先进事迹材料
2014/02/07 职场文书
卫生巾广告词
2014/03/18 职场文书
喝酒驾驶检讨书
2014/10/01 职场文书
个人四风问题整改措施
2014/10/24 职场文书
学术会议领导致辞
2015/07/29 职场文书
十大最强火系宝可梦,喷火龙上榜,第一名有双火属性
2022/03/18 日漫