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利用正则表达式去除日期中的“-”
Jul 01 Javascript
Javascript遍历Html Table示例(包括内容和属性值)
Jul 08 Javascript
JS封装的选项卡TAB切换效果示例
Sep 20 Javascript
Javascript中常用类型的格式化方法小结
Dec 26 Javascript
微信小程序 地图map实例详解
Jun 07 Javascript
Vue父组件调用子组件事件方法
Feb 23 Javascript
JS实现判断图片是否加载完成的方法分析
Jul 31 Javascript
angular实现input输入监听的示例
Aug 31 Javascript
layer iframe 设置关闭按钮的方法
Sep 12 Javascript
一篇文章带你从零快速上手Rollup
Sep 07 Javascript
浅谈Vue使用Cascader级联选择器数据回显中的坑
Oct 31 Javascript
JS中循环遍历数组的四种方式总结
Jan 23 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中str_replace函数使用小结
2008/10/11 PHP
php session_start()关于Cannot send session cache limiter - headers already sent错误解决方法
2009/11/27 PHP
php 操作数组(合并,拆分,追加,查找,删除等)
2012/07/20 PHP
php一维二维数组键排序方法实例总结
2014/11/13 PHP
php对象在内存中的存在形式分析
2015/02/03 PHP
PHP生成短网址方法汇总
2016/07/12 PHP
php+js实现裁剪任意形状图片
2018/10/31 PHP
extJs 常用到的增,删,改,查操作代码
2009/12/28 Javascript
javascript getElementsByClassName实现代码
2010/10/11 Javascript
js实现网页随机切换背景图片的方法
2014/11/01 Javascript
Javascript中获取对象的原型对象的方法小结
2015/02/25 Javascript
JavaScript实现复制或剪切内容到剪贴板功能的方法
2016/05/23 Javascript
针对后台列表table拖拽比较实用的jquery拖动排序
2016/10/10 Javascript
详解JavaScript模块化开发
2016/12/04 Javascript
详解Vue生命周期的示例
2017/03/10 Javascript
JS开发中百度地图+城市联动实现实时触发查询地址功能
2017/04/13 Javascript
基于AngularJS的拖拽文件上传的实例代码
2017/07/15 Javascript
使用vue与jquery实时监听用户输入状态的操作代码
2017/09/19 jQuery
js 客户端打印html 并且去掉页眉、页脚的实例
2017/11/03 Javascript
Vue实现按钮旋转和移动位置的实例代码
2018/08/09 Javascript
详解VUE前端按钮权限控制
2019/04/26 Javascript
AngularJs的$http发送POST请求,php无法接收Post的数据问题及解决方案
2020/08/13 Javascript
[07:08]2014DOTA2西雅图国际邀请赛 小组赛7月11日TOPPLAY
2014/07/11 DOTA
Python中的默认参数详解
2015/06/24 Python
Python连接SQLServer2000的方法详解
2017/04/19 Python
django模型层(model)进行建表、查询与删除的基础教程
2017/11/21 Python
python实现简单学生信息管理系统
2020/04/09 Python
Keras中的两种模型:Sequential和Model用法
2020/06/27 Python
中国最大的团购网站:聚划算
2016/09/21 全球购物
英国在线药房:Express Chemist
2019/03/28 全球购物
大学四年的个人自我评价
2014/01/14 职场文书
工作业绩不及格检讨书
2014/10/28 职场文书
协议书范文
2015/01/27 职场文书
少先队入队仪式主持词
2015/07/04 职场文书
详细总结Python常见的安全问题
2021/05/21 Python
对讲机知识
2022/04/07 无线电