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 相关文章推荐
js 实现无缝滚动 兼容IE和FF
Jul 15 Javascript
JavaScript中的运算符种类及其规则介绍
Sep 26 Javascript
javascript为下拉列表动态添加数据项
May 23 Javascript
项目中常用的JS方法整理
Jan 30 Javascript
jQuery插件简单学习实例教程
Jul 01 Javascript
AngularJS 单元测试(一)详解
Sep 21 Javascript
关于jQuery.ajax()的jsonp碰上post详解
Jul 02 jQuery
代码整洁之道(重构)
Oct 25 Javascript
微信小程序实现文件、图片上传功能
Aug 18 Javascript
vue实现多级菜单效果
Oct 19 Javascript
jQuery实现简单弹幕效果
Nov 28 jQuery
ES6 Object.assign()的用法及其使用
Jan 18 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 foreach循环中使用引用的问题
2013/11/06 PHP
PHP封装的字符串加密解密函数
2015/12/18 PHP
Laravel+jQuery实现AJAX分页效果
2016/09/14 PHP
CI框架表单验证实例详解
2016/11/21 PHP
PHP定义字符串的四种方式详解
2018/02/06 PHP
PHP实现15位身份证号转18位的方法分析
2019/10/16 PHP
YII2框架中查询生成器Query()的使用方法示例
2020/03/18 PHP
JavaScrip单线程引擎工作原理分析
2010/09/04 Javascript
基于jQuery的仿flash的广告轮播代码
2010/11/04 Javascript
在IE 浏览器中使用 jquery的fadeIn() 效果 英文字符字体加粗
2011/06/02 Javascript
jQuery EasyUI API 中文文档 DateTimeBox日期时间框
2011/10/16 Javascript
基于jQuery实现发送短信验证码后的倒计时功能(无视页面关闭)
2016/09/02 Javascript
jQuery将表单序列化成一个Object对象的实例
2016/11/29 Javascript
详解jQuery简单的表格应用
2016/12/16 Javascript
React入门教程之Hello World以及环境搭建详解
2017/07/11 Javascript
详解从Vue.js源码看异步更新DOM策略及nextTick
2017/10/11 Javascript
jQuery+datatables插件实现ajax加载数据与增删改查功能示例
2018/04/17 jQuery
Vue.js递归组件实现组织架构树和选人功能案例分析
2019/07/03 Javascript
javascript实现抢购倒计时程序
2019/08/26 Javascript
VUE.js实现动态设置输入框disabled属性
2019/10/28 Javascript
JavaScript实现打砖块游戏
2020/02/25 Javascript
JS Generator 函数的含义与用法实例总结
2020/04/08 Javascript
python元组操作实例解析
2014/09/23 Python
python使用mysql数据库示例代码
2017/05/21 Python
Python性能测试工具Locust安装及使用
2020/12/01 Python
英国顶尖手表珠宝品牌独家授权经销商:HS Johnson
2020/10/28 全球购物
十佳青年个人事迹材料
2014/01/28 职场文书
婚礼答谢宴主持词
2014/03/14 职场文书
《放小鸟》教学反思
2014/04/20 职场文书
重阳节活动总结
2014/08/27 职场文书
基层党员群众路线整改措施及努力方向
2014/10/28 职场文书
见义勇为事迹材料
2014/12/24 职场文书
2015年机关作风和效能建设工作总结
2015/07/23 职场文书
不要在HTML中滥用div
2021/05/08 HTML / CSS
Apache Hudi的多版本清理服务彻底讲解
2022/03/31 Servers
python实现一个简单的贪吃蛇游戏附代码
2022/06/28 Python