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让setInteval里的函数参数中的this指向特定的对象
Jan 31 Javascript
PHP结合jQuery实现的评论顶、踩功能
Jul 22 Javascript
Angular.js如何从PHP读取后台数据
Mar 24 Javascript
jQuery Easyui DataGrid点击某个单元格即进入编辑状态焦点移开后保存数据
Aug 15 Javascript
jquery 追加元素append、prepend、before、after用法与区别分析
Dec 02 Javascript
JavaScript使用delete删除数组元素用法示例【数组长度不变】
Jan 17 Javascript
react-router实现按需加载
May 09 Javascript
微信小程序wx.request实现后台数据交互功能分析
Nov 25 Javascript
vue.js中$set与数组更新方法
Mar 08 Javascript
vue下history模式刷新后404错误解决方法
Aug 18 Javascript
解决vuecli3.0热更新失效的问题
Sep 19 Javascript
React配置子路由的实现
Jun 03 Javascript
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程序?
2006/12/08 PHP
Ext.data.PagingMemoryProxy分页一次性读取数据的实现代码
2010/04/07 PHP
thinkphp四种url访问方式详解
2014/11/28 PHP
php实现的SESSION类
2014/12/02 PHP
thinkphp3.2实现在线留言提交验证码功能
2017/07/19 PHP
微信推送功能实现方式图文详解
2019/07/12 PHP
javascript中获取下个月一号,是星期几
2012/06/01 Javascript
JS 去前后空格大全(IE9亲测)
2013/07/15 Javascript
jquery实现多级下拉菜单的实例代码
2013/10/02 Javascript
javascript元素动态创建实现方法
2015/05/13 Javascript
Js和JQuery获取鼠标指针坐标的实现代码分享
2015/05/25 Javascript
理解javascript中的MVC模式
2016/01/28 Javascript
js 截取或者替换字符串中的数字实现方法
2016/06/13 Javascript
微信页面倒计时代码(解决safari不兼容date的问题)
2016/12/13 Javascript
nodejs对express中next函数的一些理解
2017/09/08 NodeJs
Angularjs使用过滤器完成排序功能
2017/09/20 Javascript
微信小程序实现自上而下字幕滚动
2018/07/14 Javascript
JavaScript实现的滚动公告特效【基于jQuery】
2019/07/10 jQuery
[01:06]DOTA2小知识课堂 Ep.02 吹风竟可解梦境缠绕
2019/12/05 DOTA
python编程-将Python程序转化为可执行程序[整理]
2007/04/09 Python
python避免死锁方法实例分析
2015/06/04 Python
Python 基于Twisted框架的文件夹网络传输源码
2016/08/28 Python
python进行文件对比的方法
2018/12/24 Python
Django uwsgi Nginx 的生产环境部署详解
2019/02/02 Python
python 计算积分图和haar特征的实例代码
2019/11/20 Python
python构造IP报文实例
2020/05/05 Python
python实现xml转json文件的示例代码
2020/12/30 Python
python Scrapy框架原理解析
2021/01/04 Python
HTML5拖拉上传文件的简单实例
2017/01/11 HTML / CSS
美国领先的商务贺卡出版商:The Gallery Collection
2018/02/13 全球购物
.NET现在共支持多少种语言
2014/02/26 面试题
师范应届生教师求职信
2013/11/05 职场文书
厂长助理岗位职责
2013/12/27 职场文书
写给女生的道歉信
2014/01/08 职场文书
工作岗位说明书模板
2014/05/09 职场文书
大班下学期幼儿评语
2014/12/30 职场文书