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 相关文章推荐
定义JavaScript二维数组采用定义数组的数组来实现
Dec 09 Javascript
Knockout数组(observable)使用详解示例
Nov 15 Javascript
Javascript函数的参数
Jul 16 Javascript
jQuery实现漂亮实用的商品图片tips提示框效果(无图片箭头+阴影)
Apr 16 Javascript
将JSON字符串转换成Map对象的方法
Nov 30 Javascript
JavaScript正则表达式的贪婪匹配和非贪婪匹配
Sep 05 Javascript
js匿名函数使用&amp;传参(实例)
Sep 08 Javascript
浅谈Vue2.0父子组件间事件派发机制
Jan 08 Javascript
webpack4 处理CSS的方法示例
Sep 03 Javascript
vue-自定义组件传值的实例讲解
Sep 18 Javascript
微信小程序webview与h5通过postMessage实现实时通讯的实现
Aug 20 Javascript
layui.tree组件的使用以及搜索节点功能的实现
Sep 26 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
linux下为php添加curl扩展的方法
2011/07/29 PHP
如何设置mysql允许外网访问
2013/06/04 PHP
探讨捕获php错误信息方法的详解
2013/06/09 PHP
PhpStorm本地断点调试的方法步骤
2018/05/21 PHP
添加到收藏夹代码(兼容几乎所有的浏览器)
2007/01/09 Javascript
一个简单的js渐显(fadeIn)渐隐(fadeOut)类
2010/06/19 Javascript
JavaScript中几个重要的属性(this、constructor、prototype)介绍
2013/05/19 Javascript
jquery 日期控件datepicker属性详细解析
2013/11/08 Javascript
了不起的node.js读书笔记之node.js中的特性
2014/12/22 Javascript
jQuery实现查找链接文字替换属性的方法
2016/06/27 Javascript
JS中BOM相关知识点总结(必看篇)
2016/11/22 Javascript
vue项目打包后上传至GitHub并实现github-pages的预览
2019/05/06 Javascript
es6数组之扩展运算符操作实例分析
2020/04/25 Javascript
Node使用koa2实现一个简单JWT鉴权的方法
2021/01/26 Javascript
详解Django框架中用context来解析模板的方法
2015/07/20 Python
Python代码块批量添加Tab缩进的方法
2018/06/25 Python
用python实现k近邻算法的示例代码
2018/09/06 Python
Python中logging.NullHandler 的使用教程
2018/11/29 Python
详解Python3定时器任务代码
2019/09/23 Python
python 多进程并行编程 ProcessPoolExecutor的实现
2019/10/11 Python
python实现图像全景拼接
2020/03/27 Python
Python调用C/C++的方法解析
2020/08/05 Python
CSS3 RGBA色彩模式使用实例讲解
2016/04/26 HTML / CSS
css3 利用transform打造走动的2D时钟
2020/10/20 HTML / CSS
印度化妆品购物网站:Nykaa
2018/07/22 全球购物
应届毕业生专业个人求职自荐信格式
2013/11/20 职场文书
寒假实习自荐信
2014/01/26 职场文书
水电站项目建议书
2014/05/12 职场文书
贸易经济专业自荐书
2014/06/29 职场文书
司法局群众路线教育实践活动开展情况总结
2014/10/25 职场文书
2014年招商引资工作总结
2014/11/22 职场文书
个人学习总结范文
2015/02/15 职场文书
《正比例》教学反思
2016/02/23 职场文书
2016企业先进集体事迹材料
2016/02/25 职场文书
mysql知识点整理
2021/04/05 MySQL
正确的理解和使用Django信号(Signals)
2021/04/14 Python