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 相关文章推荐
IE 上下滚动展示模仿Marquee机制
Dec 20 Javascript
关于可运行代码无法正常执行的使用说明
May 13 Javascript
关于锚点跳转及jQuery下相关操作与插件
Oct 01 Javascript
jquery的相对父元素和相对文档定位示例代码
Aug 02 Javascript
jQuery实现用户注册的表单验证示例
Aug 28 Javascript
jQuery将多条数据插入模态框的示例代码
Sep 25 Javascript
Node.js异步I/O学习笔记
Nov 04 Javascript
Javascript核心读书有感之类型、值和变量
Feb 11 Javascript
微信开发 JS-SDK 6.0.2 经常遇到问题总结
Dec 08 Javascript
正则验证小数点后面只能有两位数的方法
Feb 28 Javascript
vue项目部署到Apache服务器中遇到的问题解决
Aug 24 Javascript
angular 实时监听input框value值的变化触发函数方法
Aug 31 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 strtotime 函数UNIX时间戳
2009/01/14 PHP
php中将地址生成迅雷快车旋风链接的代码[测试通过]
2011/04/20 PHP
Linux下实现PHP多进程的方法分享
2012/08/16 PHP
php提示Warning:mysql_fetch_array() expects的解决方法
2014/12/16 PHP
php7下的filesize函数
2019/09/30 PHP
关于laravel-admin ueditor 集成并解决刷新的问题
2019/10/21 PHP
javascript+dom树型菜单类,希望朋友们一起进步
2007/05/03 Javascript
基于Jquery的$.cookie()实现跨越页面tabs导航实现代码
2011/03/03 Javascript
学习JavaScript的最佳方法分享
2011/10/21 Javascript
JavaScript判断变量是对象还是数组的方法
2014/08/28 Javascript
Javascript中的几种URL编码方法比较
2015/01/23 Javascript
再谈JavaScript线程
2015/07/10 Javascript
Cookies 和 Session的详解及区别
2017/04/21 Javascript
Vue数组更新及过滤排序功能
2017/08/10 Javascript
Js利用prototype自定义数组方法示例
2017/10/20 Javascript
解决vue-cli创建项目的loader问题
2018/03/13 Javascript
详解js中let与var声明变量的区别
2020/04/05 Javascript
python实现二维码扫码自动登录淘宝
2016/12/27 Python
python实现解数独程序代码
2017/04/12 Python
用Python下载一个网页保存为本地的HTML文件实例
2018/05/21 Python
Empty test suite.(PyCharm程序运行错误的解决方法)
2018/11/30 Python
python+OpenCV实现车牌号码识别
2019/11/08 Python
Python使用sqlite3模块内置数据库
2020/05/07 Python
Python 使用Opencv实现目标检测与识别的示例代码
2020/09/08 Python
python绘制汉诺塔
2021/03/01 Python
网络艺术零售业的先驱者:artrepublic
2017/09/26 全球购物
牛津在线药房:Oxford Online Pharmacy
2020/11/16 全球购物
请编写一个 C 函数,该函数在给定的内存区域搜索给定的字符,并返回该字符所在位置索引值
2014/09/15 面试题
函授教育个人学习的自我评价
2013/12/31 职场文书
应届毕业生个人求职信范文
2014/01/29 职场文书
小学安全工作汇报材料
2014/08/19 职场文书
社区护士演讲稿
2014/08/27 职场文书
2015年物流客服工作总结
2015/07/27 职场文书
医德医风学习心得体会
2016/01/25 职场文书
以下牛机,你有几个
2022/04/05 无线电
Go web入门Go pongo2模板引擎
2022/05/20 Golang