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 相关文章推荐
JS面向对象编程 for Cookie
Sep 19 Javascript
javascript实现tabs选项卡切换效果(自写原生js)
Mar 19 Javascript
jQuery实现 注册时选择阅读条款 左右移动
Apr 11 Javascript
js传参数受特殊字符影响错误的解决方法
Oct 21 Javascript
JQuery对表单元素的基本操作使用总结
Jul 18 Javascript
javascript学习笔记整理(概述、变量、数据类型简介)
Oct 25 Javascript
深入浅析JavaScript面向对象和原型函数
Feb 06 Javascript
详解vue路由篇(动态路由、路由嵌套)
Jan 27 Javascript
vue实现的下拉框功能示例
Jan 29 Javascript
关于在LayUI中使用AJAX提交巨坑记录
Oct 25 Javascript
Javascript组合继承方法代码实例解析
Apr 02 Javascript
JavaScript Array.flat()函数用法解析
Sep 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
php xml 入门学习资料
2011/01/01 PHP
php数组函数序列之array_sum() - 计算数组元素值之和
2011/10/29 PHP
PHP获取windows登录用户名的方法
2014/06/24 PHP
PHP开发Apache服务器配置
2015/07/15 PHP
PHP聚合式迭代器接口IteratorAggregate用法分析
2017/12/28 PHP
PHP微信H5支付开发实例
2018/07/25 PHP
PHP常用日期加减计算方法实例小结
2018/07/31 PHP
CI框架实现创建自定义类库的方法
2018/12/25 PHP
IE与Firefox下javascript getyear年份的兼容性写法
2007/12/20 Javascript
javascript显式类型转换实例分析
2015/04/25 Javascript
jQuery编程中的一些核心方法简介
2015/08/14 Javascript
学习Javascript闭包(Closure)知识
2016/08/07 Javascript
JS实现六边形3D拖拽翻转效果的方法
2016/09/11 Javascript
Bootstrap下拉菜单Dropdowns的实现代码
2017/03/17 Javascript
微信小程序实现拖拽 image 触摸事件监听的实例
2017/08/17 Javascript
vue项目中使用lib-flexible解决移动端适配的问题解决
2018/08/23 Javascript
JavaScript函数式编程(Functional Programming)组合函数(Composition)用法分析
2019/05/22 Javascript
bootstrap-treeview实现多级树形菜单 后台JSON格式如何组织?
2019/07/26 Javascript
Vue代码整洁之去重方法整理
2019/08/06 Javascript
vue实现表格过滤功能
2019/09/27 Javascript
Vue替代marquee标签超出宽度文字横向滚动效果
2019/12/09 Javascript
[02:39]DOTA2国际邀请赛助威团西雅图第一天
2013/08/08 DOTA
Python连接mysql数据库的正确姿势
2016/02/03 Python
不知道这5种下划线的含义,你就不算真的会Python!
2018/10/09 Python
Python实现Linux监控的方法
2019/05/16 Python
Python.append()与Python.expand()用法详解
2019/12/18 Python
纯css3实现照片墙效果
2014/12/26 HTML / CSS
TUMI香港官网:国际领先的行李箱、背囊品牌
2021/03/01 全球购物
银行会计职员个人的自我评价
2013/09/29 职场文书
期末总结的个人自我评价
2013/11/02 职场文书
讲文明树新风公益广告宣传方案
2014/02/25 职场文书
歌唱比赛策划方案
2014/06/06 职场文书
法学专业毕业生求职信
2014/06/12 职场文书
党校毕业个人总结
2015/02/28 职场文书
入党介绍人考察意见
2015/06/01 职场文书
戴尔Win11系统no bootable devices found解决教程
2022/09/23 数码科技