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 相关文章推荐
JQuery 表单中textarea字数限制实现代码
Dec 07 Javascript
javascript+css 网页每次加载不同样式的实现方法
Dec 27 Javascript
获取数组中最大最小值方法js代码(自写)
Aug 12 Javascript
JavaScript中的值是按值传递还是按引用传递问题探讨
Jan 30 Javascript
jQuery判断多个input file 都不能为空的例子
Jun 23 Javascript
详解JavaScript的回调函数
Nov 20 Javascript
超漂亮的Bootstrap 富文本编辑器summernote
Apr 05 Javascript
react 应用多入口配置及实践总结
Oct 17 Javascript
详解微信小程序文件下载--视频和图片
Apr 24 Javascript
原生js滑动轮播封装
Jul 31 Javascript
基于vue项目设置resolves.alias: '@'路径并适配webstorm
Dec 02 Vue.js
JavaScript 事件捕获冒泡与捕获详情
Nov 11 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
博士208HAF收音机实习报告
2021/03/02 无线电
PHP+AJAX实现无刷新注册(带用户名实时检测)
2006/12/02 PHP
探讨:parse url解析URL,返回其组成部分
2013/06/14 PHP
thinkphp实现like模糊查询实例
2014/10/29 PHP
thinkPHP实现表单自动验证
2014/12/24 PHP
C# WinForm中实现快捷键自定义设置实例
2015/01/23 PHP
php防止用户重复提交表单
2015/11/02 PHP
详解WordPress中提醒安装插件以及隐藏插件的功能实现
2015/12/25 PHP
PHP实现图的邻接矩阵表示及几种简单遍历算法分析
2017/11/24 PHP
PHP添加文字水印或图片水印的水印类完整源代码与使用示例
2019/03/18 PHP
通过Jscript中@cc_on 语句识别IE浏览器及版本的代码
2011/05/07 Javascript
JS+ACTIVEX实现网页选择本地目录路径对话框
2013/03/18 Javascript
window.showModalDialog参数传递中含有特殊字符的处理方法
2013/06/06 Javascript
js 单击式的下拉菜单效果实例
2013/08/13 Javascript
在ASP.NET中使用JavaScript脚本的方法
2013/11/12 Javascript
Js实现无刷新删除内容
2015/04/29 Javascript
JavaScript高级程序设计(第三版)学习笔记1~5章
2016/03/11 Javascript
Bootstrap组件(一)之菜单
2016/05/11 Javascript
jQuery数据检索中根据关键字快速定位GridView指定行的实现方法
2016/06/08 Javascript
详解Angular的双向数据绑定(MV-VM)
2016/12/26 Javascript
原生js实现电商侧边导航效果
2017/01/19 Javascript
Three.js获取鼠标点击的三维坐标示例代码
2017/03/24 Javascript
php中and 和 &amp;&amp;出坑指南
2018/07/13 Javascript
基于JS实现简单滑块拼图游戏
2019/10/12 Javascript
element中table高度自适应的实现
2020/10/21 Javascript
django配置连接数据库及原生sql语句的使用方法
2019/03/03 Python
python查看数据类型的方法
2019/10/12 Python
Python pyautogui模块实现鼠标键盘自动化方法详解
2020/02/17 Python
Python中使用aiohttp模拟服务器出现错误问题及解决方法
2020/10/31 Python
Pytorch实验常用代码段汇总
2020/11/19 Python
HTML5 本地存储和内容按需加载的思路和方法
2011/04/07 HTML / CSS
EGO Shoes美国/加拿大:英国时髦鞋类品牌
2018/08/04 全球购物
亲子拓展活动方案
2014/02/20 职场文书
小学一年级评语大全
2014/04/22 职场文书
奥运会口号
2014/06/13 职场文书
Redis数据结构之链表与字典的使用
2021/05/11 Redis