jQuery后代选择器用法实例


Posted in Javascript onDecember 23, 2014

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

后代选择器匹配给定的祖先元素下用以匹配的所有后代元素。

点击选择器可以查阅参考手册中所有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">

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

</div>

<div class="anotherdiv">

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

</div>

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

</body>

</html>

该实例可实现将类名为mydiv的div下的span元素中的文本颜色设置为红色。

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

Javascript 相关文章推荐
jquery一般方法介绍 入门参考
Jun 21 Javascript
jQueryUI写一个调整分类的拖放效果实现代码
May 10 Javascript
用JavaScript获取DOM元素位置和尺寸大小的方法
Apr 12 Javascript
jquery animate实现鼠标放上去显示离开隐藏效果
Jul 21 Javascript
Js 正则表达式知识汇总
Dec 02 Javascript
javascript框架设计读书笔记之模块加载系统
Dec 02 Javascript
jQuery判断一个元素是否可见的方法
Jun 05 Javascript
微信小程序开发之animation循环动画实现的让云朵飘效果
Jul 14 Javascript
angularjs $http调用接口的方式详解
Aug 13 Javascript
vue实现带过渡效果的下拉菜单功能
Feb 19 Javascript
ant-design-vue按需加载的坑的解决
May 14 Javascript
Vue proxyTable配置多个接口地址,解决跨域的问题
Sep 11 Javascript
浅析Javascript中“==”与“===”的区别
Dec 23 #Javascript
javascript实现微信分享
Dec 23 #Javascript
JSON取值前判断
Dec 23 #Javascript
jQuery基础语法实例入门
Dec 23 #Javascript
jQuery回调函数的定义及用法实例
Dec 23 #Javascript
jQuery中odd选择器的定义和用法
Dec 23 #Javascript
浅析javascript 定时器
Dec 23 #Javascript
You might like
php 一元分词算法
2009/11/30 PHP
LotusPhp笔记之:Cookie组件的使用详解
2013/05/06 PHP
一组PHP加密解密函数分享
2014/06/05 PHP
php遍历数组的4种方法总结
2014/07/05 PHP
php限制ip地址范围的方法
2015/03/31 PHP
ThinkPHP的SAE开发相关注意事项详解
2016/10/09 PHP
PHP基于堆栈实现的高级计算器功能示例
2017/09/15 PHP
php删除二维数组中的重复值方法
2018/03/12 PHP
javascript parseInt与Number函数的区别
2010/01/21 Javascript
jQuery 插件仿百度搜索框智能提示(带Value值)
2013/01/22 Javascript
jquery使用hide方法隐藏指定id的元素
2015/03/30 Javascript
web前端开发JQuery常用实例代码片段(50个)
2015/08/28 Javascript
分享10个优化代码的CSS和JavaScript工具
2016/05/11 Javascript
jQuery 中ajax异步调用的四种方式
2016/06/28 Javascript
基于Javascript倒计时效果
2016/12/22 Javascript
详解刷新页面vuex数据不消失和不跳转页面的解决
2018/01/30 Javascript
this.$toast() 了解一下?
2019/04/18 Javascript
微信小程序人脸识别功能代码实例
2019/05/07 Javascript
vue实现轮播图帧率播放
2021/01/26 Vue.js
[00:32]2018DOTA2亚洲邀请赛Liquid出场
2018/04/03 DOTA
python3.3使用tkinter开发猜数字游戏示例
2014/03/14 Python
python 打印出所有的对象/模块的属性(实例代码)
2016/09/11 Python
python实现对csv文件的列的内容读取
2018/07/04 Python
Python3实现的判断环形链表算法示例
2019/03/07 Python
Pandas中DataFrame的分组/分割/合并的实现
2019/07/16 Python
python for循环remove同一个list过程解析
2019/08/14 Python
pytorch自定义初始化权重的方法
2019/08/17 Python
使用Python爬取弹出窗口信息的实例
2020/03/14 Python
plt.figure()参数使用详解及运行演示
2021/01/08 Python
外企C语言笔试题
2013/11/10 面试题
this关键字的含义
2015/04/08 面试题
银行实习生的自我评价
2013/12/09 职场文书
手机被没收检讨书
2014/02/22 职场文书
成语的广告词
2014/03/19 职场文书
中考标语大全
2014/06/05 职场文书
创业计划书之花店
2019/09/20 职场文书