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 相关文章推荐
比例尺、缩略图、平移缩放之百度地图添加控件方法
Aug 03 Javascript
学习JavaScript设计模式(代理模式)
Dec 03 Javascript
JS使用cookie设置样式的方法
Jun 30 Javascript
微信小程序 WXML、WXSS 和JS介绍及详解
Oct 08 Javascript
Vue.js列表渲染绑定jQuery插件的正确姿势
Jun 29 jQuery
JS点击缩略图整屏居中放大图片效果
Jul 04 Javascript
Bootstrap 按钮样式与使用代码详解
Dec 09 Javascript
150行代码带你实现微信小程序中的数据侦听
May 17 Javascript
微信小程序动态评分展示/五角星展示/半颗星展示/自定义长度展示功能的实现
Jul 22 Javascript
封装 axios+promise通用请求函数操作
Aug 11 Javascript
CentOS 8.2服务器上安装最新版Node.js的方法
Dec 16 Javascript
详解为什么Vue中的v-if和v-for不建议一起用
Jan 13 Vue.js
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
php面向对象全攻略 (九)访问类型
2009/09/30 PHP
FirePHP 推荐一款PHP调试工具
2011/04/23 PHP
ThinkPHP模板引擎之导入资源文件方法详解
2014/06/18 PHP
PHP中文字符串截断无乱码解决方法
2016/10/10 PHP
javascript第一课
2007/02/27 Javascript
js+FSO遍历文件夹下文件并显示
2007/03/07 Javascript
jQuery Selector选择器小结
2010/05/06 Javascript
js获取select标签选中值的两种方式
2014/01/09 Javascript
jquery操作checked属性以及disabled属性的多种方法
2014/06/20 Javascript
javascript框架设计读书笔记之模块加载系统
2014/12/02 Javascript
jQuery的deferred对象使用详解
2016/09/25 Javascript
微信小程序 视图容器组件的详解及实例代码
2017/01/19 Javascript
js获取元素下的第一级子元素的方法(推荐)
2017/03/05 Javascript
JS查找英文文章中出现频率最高的单词
2017/03/20 Javascript
Javascript格式化并高亮xml字符串的方法及注意事项
2018/08/13 Javascript
实例详解ztree在vue项目中使用并且带有搜索功能
2018/08/24 Javascript
JavaScript动态添加数据到表单并提交的几种方式
2019/06/26 Javascript
Vue.js自定义指令学习使用详解
2019/10/19 Javascript
layui table 复选框跳页后再回来保持原来选中的状态示例
2019/10/26 Javascript
nginx配置域名后的二级目录访问不同项目的配置操作
2020/11/06 Javascript
[48:18]DOTA2-DPC中国联赛 正赛 RNG vs Dynasty BO3 第二场 1月29日
2021/03/11 DOTA
用pywin32实现windows模拟鼠标及键盘动作
2014/04/22 Python
Python矩阵常见运算操作实例总结
2017/09/29 Python
浅谈python装饰器探究与参数的领取
2017/12/01 Python
python的pandas工具包,保存.csv文件时不要表头的实例
2018/06/14 Python
Python利用递归实现文件的复制方法
2018/10/27 Python
windows下搭建python scrapy爬虫框架步骤
2018/12/23 Python
Python IDE Pycharm中的快捷键列表用法
2019/08/08 Python
python实现logistic分类算法代码
2020/02/28 Python
欧姆龙医疗保健与医疗产品:Omron Healthcare
2020/02/10 全球购物
网友共享的几个面试题关于Java和Unix等方面的
2016/09/08 面试题
我的教育故事演讲稿
2014/05/04 职场文书
婚礼秀策划方案
2014/05/19 职场文书
情人节单身感言
2015/08/03 职场文书
演讲稿之开卷有益
2019/08/07 职场文书
Python基础知识之变量的详解
2021/04/14 Python