jQuery大于号(>)选择器的作用解释


Posted in Javascript onJanuary 13, 2015

jQuery选择器中的大于号>作用是什么:
jQuery灵活多样的选择器是jQuery的优点之一。
下面就介绍一下其中的一个选择器,用大于号表示。
代码示例如下:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<title>蚂蚁部落</title>

<style type="text/css">

#box{

  width:300px;

  height:200px;

  background:black;

}

#middle{

  width:200px;

  height:150px;

  background:red;

  margin:0px auto;

}

#inner{

  width:100px;

  height:100px;

  background:blue;

  margin:0px auto;

}

</style>

<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>

<script>

$(document).ready(function(){

  $("#box>div").css("background-color","green");

});

</script>

</head>

<body>

<div id="box">

  <div id="middle">

    <div id="inner"></div>

  </div>

</div>

</body>

</html>

上面的代码可以将box元素下第一级div子元素的背景颜色设置为绿色。
也就是说>选择器是匹配指定元素的一级子元素,而不是所有的后代元素。

Javascript 相关文章推荐
Javascript与vbscript数据共享
Jan 09 Javascript
一些常用的JS功能函数(2009-06-04更新)
Jun 04 Javascript
js获取GridView中行数据的两种方法 分享
Jul 13 Javascript
JS逆序遍历实现代码
Dec 02 Javascript
javascript实现根据3原色制作颜色选择器的方法
Jul 17 Javascript
URL中“#” “?” &amp;“”号的作用浅析
Feb 04 Javascript
js实现无缝滚动图(可控制当前滚动的方向)
Feb 22 Javascript
js实现省市级联效果分享
Aug 10 Javascript
浅谈vue后台管理系统权限控制思考与实践
Dec 19 Javascript
Layui table field初始化加载时进行隐藏的方法
Sep 19 Javascript
基于Vue实现微前端的示例代码
Apr 24 Javascript
Jquery如何使用animation动画效果改变背景色的代码
Jul 20 jQuery
javascript面向对象之this关键词用法分析
Jan 13 #Javascript
javascript和jquery实现设置和移除文本框默认值效果代码
Jan 13 #Javascript
javascript面向对象之访问对象属性的两种方式分析
Jan 13 #Javascript
javascript面向对象之对象的深入理解
Jan 13 #Javascript
jQuery实现设置、移除文本框默认值功能
Jan 13 #Javascript
javascript面向对象快速入门实例
Jan 13 #Javascript
javascript引用赋值(地址传值)用法实例
Jan 13 #Javascript
You might like
日本十大最佳动漫,全都是二次元的神级作品
2019/10/05 日漫
使用数据库保存session的方法
2006/10/09 PHP
PHP+JS无限级可伸缩菜单详解(简单易懂)
2007/01/02 PHP
PHP 中英文混合排版中处理字符串常用的函数
2007/04/12 PHP
一道求$b相对于$a的相对路径的php代码
2010/08/08 PHP
Codeigniter购物车类不能添加中文的解决方法
2014/11/29 PHP
PHP中使用BigMap实例
2015/03/30 PHP
Yii redis集合的基本使用教程
2020/06/14 PHP
js实现翻页后保持checkbox选中状态的实现方法
2012/11/03 Javascript
jQuery中(function($){})(jQuery)详解
2015/07/15 Javascript
理解Javascript图片预加载
2016/02/23 Javascript
Bootstrap进度条组件知识详解
2016/05/01 Javascript
基于jQuery的ajax方法封装
2016/07/14 Javascript
JS实现页面载入时随机显示图片效果
2016/09/07 Javascript
jQuery使用ajax方法解析返回的json数据功能示例
2017/01/10 Javascript
javascript基础练习之翻转字符串与回文
2017/02/20 Javascript
Angular6 Filter实现页面搜索的示例代码
2018/12/02 Javascript
深入学习JavaScript中的bom
2019/05/27 Javascript
layui table 获取分页 limit的方法
2019/09/20 Javascript
Js数组扁平化实现方法代码总汇
2020/11/11 Javascript
python基础教程之匿名函数lambda
2017/01/17 Python
详解使用python的logging模块在stdout输出的两种方法
2017/05/17 Python
Python中表示字符串的三种方法
2017/09/06 Python
对python中for、if、while的区别与比较方法
2018/06/25 Python
解决Python3 被PHP程序调用执行返回乱码的问题
2019/02/16 Python
python爬虫 正则表达式解析
2019/09/28 Python
linux 下selenium chrome使用详解
2020/04/02 Python
HTML5 新标签全部总汇(推荐)
2016/06/13 HTML / CSS
英国最全面的橄榄球联盟门票网站:Live Rugby Tickets
2018/10/06 全球购物
理工科学生的自我评价
2013/12/15 职场文书
安全宣传标语
2014/06/10 职场文书
物理学专业求职信
2014/07/04 职场文书
迎国庆演讲稿
2014/09/15 职场文书
后备干部推荐材料
2014/12/24 职场文书
2015年学校教务处工作总结
2015/05/11 职场文书
如何在pycharm中快捷安装pip命令(如pygame)
2021/05/31 Python