前端开发常见的选择器,都在这里了,在实际工作中用也是非常常见的。工欲善,必选利其器。首先了解学习最基本的选择器。
基本选择器:
#id
.class
element
*
s1,s2,s3
层级选择器:
parent child后代选择器
parent > child子代选择器
prev + nextOne下一个兄弟选择器
prev ~ nextAll后续所有兄弟选择器
过滤选择器——基本过滤
注意:把所有符合条件的元素放在一个大的集合中,从该大集合进行过滤。序号从0开始
:first
:last
:odd第奇数个
:even第偶数个
:eq(i)第i个
:gt(i)大于i
:lt(i)小于i
过滤选择器——内容过滤
:contains(内容)包含指定内容
:empty不包含任何内容
:has(s)有符合特定选择器的
:parent有内容的
过滤选择器——属性过滤
[name]具有指定属性
[name=value]具有指定属性和值
[name!=value]具有指定属性,不能有指定的值
[name^=start]具有指定属性,以指定值开头
[name$=end]具有指定属性,以指定值结尾
[name*=sub]具有指定属性,值包含指定内容
过滤选择器——可见性过滤
:hiddendisplay:none + type="hidden"【只有这2个】
:visible
子元素选择器
提示:把每个选中的元素放在其父元素对应的小组中,进行筛选;下标从1开始!不是0!!
:first-child第一个子元素
:last-child最后一个子元素
:nth-child(数字/odd/even/形如3n+1表达式) 第n个子元素
:only-child唯一子元素
表单元素选择器
:text选中
:password选中
:radio
:checkbox
:submit
:reset
:button选中
:file选中
:hidden选中
:image选中提交提交,不能选中
:input选中表单中所有的输入元素,包括input、select、textarea、button等
表单元素状态选择器
:enabled选中所有启用的元素,不带disabled属性的元素
:disabled选中表单中带 disabled 属性的元素
:checked选中
:selected选中
朝阳路民航医院对面
185-0032-5287
关注账号了解更多资讯与福利