jquery、css 的选择器(逗号/空格/英文句号/大于号/加号/波浪号)
符号 | 描述 | 示例 | 说明 |
---|---|---|---|
紧接无符号 | 相当于”并且“关系 |
input.k-textbox{ ... } |
选出input并且包含k-textbox类的元素 |
, (逗号) | 选择器分格符, 选择多种元素 |
h1, h2{ ... } |
选出h1 和 h2 的所有元素 |
. (圆点) | 类选择器 |
.k-textbox{ ... } |
选出包含k-textbox类的元素 |
*(星号) | 所有元素 |
*{ ... } |
选择所有的元素 |
# (井号) | ID选择器 |
#mem-id{ ... } |
选择 ID 为 mem-id 的元素 |
[ ] (中括号) | 属性选择器 |
h1[class='k-textbox']{ ... } |
选择h1并且包含k-textbox类的元素 |
(空格) | 后代选择器 |
#container h1{ ... } |
选择 ID 为 container 内的所有为h1后代元素 |
> (大于号) | 子元素选择器 |
#container>h1{ ... } |
选择 ID 为 container 内的所有为h1的子元素(仅限子元素,孙的不计) |
+ (加号) | 后面紧挨的兄弟选择器 |
#mem-id+h1{ ... } |
选择 ID 为 mem-id 的后面 "紧挨" 的h1元素 |
~ (波浪线) | 兄弟元素选择器 |
#mem-id~h1{ ... } |
选择ID 为 mem-id 的所有h1兄弟元素 |
: 或 :: | 伪类 |
在選擇器里面幾種符號
1,(逗號)
2 (空格)
3.(英文句號)
4>(大于號)
5+(加號)
6~(波浪號)
- 逗號
各選擇器之間用逗號分開 匹配查詢的時候 之間是 “或”的關系
- 空格
在用空格前的selector匹配的結果里面 用空格后面的selector 做結果的全局匹配
- 英文句號
匹配的是class(class='style')
- 大于號
用大于號后面的selector對前面的結果在子內容 做同維度匹配
- 加號
匹配結果 用加號后面的 selector 對前面的結果同一級的內容做全局匹配
- 波浪好
匹配結果 用加號后面的 selector 對前面的結果同一級的內容做同級匹配
特別說明的
1 空格與大于號
“空格”和“大于號”都是對前面的匹配結果的子內容做匹配。不同的是“空格”做的是子內容和孫內容匹配,而“大于號”只對子內容做匹配
2 加號與波浪號
“加號”和“波浪好” 都是對前面匹配結果的同一級內容做匹配。不同的跟上面的差別一樣,“加號”是子孫內容,而“波浪號”只是子內容
這只是部分jquery的selector
后面看完后覺得jquery的selector很好很強大
jquery、css 的选择器(逗号/空格/英文句号/大于号/加号/波浪号)相关推荐
- jquery、css 的选择器(逗号/空格/英文句号/大于号/加号/波浪号)备忘
jQuery.CSS常用选择器 符号 描述 示例 说明 紧接无符号 相当于"并且"关系 input.k-textbox{ ... } 选出input并且包含k-textbox ...
- css的选择器-逗号、空格分隔和连写的区别
css的选择器-逗号.空格分隔和连写的区别 1.连写 .a.b{background-color:pink; } 当两个元素名写在一起时,表示当前元素在html中同时出现才会出现效果,即 <di ...
- 【Css】css中class之间>(大于号)、~(波浪号)、 (空格)、,(逗号)、+(加号)详解(转载,笔记用)
css中">"(大于号)."~"(波浪号)." "(空格).","(逗号)."+"(加号)详解 ...
- “〜”(波浪号/波浪形/旋转)CSS选择器是什么意思?
本文翻译自:What does the "~" (tilde/squiggle/twiddle) CSS selector mean? Searching for the ~ ch ...
- css基本选择器,id选择器,class选择器,标签选择器,*通配符选择器,逗号 空格 + >
全栈工程师开发手册 (作者:栾鹏) css系列教程1-选择器全解 css基本选择器 包括id选择器,class选择器,标签选择器,*通配符选择器,以及使用逗号实现查询集合,空格实现查询后代,>实 ...
- jQuery css()选择器使用说明
css选择器只是jquery中的一个功能罢了,下面我来给各位朋友详细介绍jQuery css()选择器使用方法与说明详解,有需要了解学习的同学可参考. CSS操作有一个重要的方法:CSS() CSS( ...
- 关于css中“点“,“井号“,“逗号“,“空格“,“冒号“的用法
详解css中"点","井号","逗号","空格","冒号"的用法_三级小野怪的专栏-CSDN博客bo ...
- jquery选择器空格与大于号、加号与波浪号的区别
转自: http://my.oschina.net/jsonavaj/blog/62630 空格:$('parent childchild')表示获取parent下的所有的childchild节点(所 ...
- html中css的逗号用法,css样式多个类、标签用【逗号 空格 冒号 点】分开的解析...
ReactNative学习之css样式使用 前言: 前面学习了html,今天学习一下css的基本使用,看下html与css之间是如何结合来编写前端网页的. CSS 是什么? CSS 是 Cascadi ...
最新文章
- boost::type_erasure::param相关的测试程序
- Python自动化运维开发----基础(十二)函数
- CVPR 2018 paper list(论文列表)
- linux syslog详解-------未测试
- 如何用php开启企业微信开发的回调模式
- thinkphp5.0.6 连接SQLServer2008r2 配置总结
- 【OpenCV学习笔记】【编程实例】三(将一个图像中的指定区域拷贝到另一个图像的指定区域
- Samba使用大全(绝对经典)
- 强化学习的A3C算法应用(训练Atari游戏)
- 软件项目估算概念、步骤、方法、戒律总览
- bitbucket 预览html,BitBucket基本使用操作
- 行业“地震” 监管机构对新车「辅助驾驶系统」评级“下手”
- 为什么你宁愿吃生活的苦,也不愿吃学习的苦
- 杨立昆最新访谈:AI威胁论是蒙昧主义,控制欲只有人才有 (全文+视频)
- c语言里函数rand()和srand()的用法
- PTA(2019年天梯赛-全国总决赛)----彩虹瓶 (25分)
- ThinkPad笔记本电脑海淘简单教程及注意事项
- usb口拒绝访问_u盘无法打开磁盘无法访问拒绝访问该怎么解决?
- 什么是SCA(软件成分分析)
- 关于Vegas制作炫酷文字转场片头效果的教程分享