css选择器:
选择器 语法 描述 示例
标签选择器 E{css规则} 以文档元素作为选择符 td{font-size:14px;}
id选择器 #ID{css规则} 以文档元素的唯一标识符id作为选择符 #note{width:120px}
类选择器 E.classname{css规则} 以文档元素的class作为选择符 div.note{width:120px}.dream{width:120px}
群组选择器 E1,E2,E3{css规则} 多个选择符对应相同的样式规则 td,p,div{font-size:12px;}
后代选择器 E F{css规则} 元素E的任意后代元素F #links a{color:red}
通配符选择器 *{css规则} 所有元素标签选择器 *{font-size:22px;}
除此之外css中还有伪类选择器,子选择器,临近选择器,属性选择器等.
jquery选择器:
下面是思维导图:
jquery的优点:
1>写法简单
2>支持css1,css2的全部和css3的部分选择器,同时它也有少量独有的选择器
3>完善的处理机制
jquery选择器的分类:
1.基本选择器
选择器 描述 返回
#id 根据给定的id匹配一个元素 单个元素
.class 根据给定类明匹配元素 集合元素
element 根据给定的元素匹配元素 集合元素
* 匹配所有元素 集合元素
selector1,selector2..... 将每一个匹配的元素合并一起返回 集合元素
2.层次选择器
选择器 描述 返回
$("a b") 选取a元素里所有的b(后代)元素 集合元素
$("par>chi") 选取par元素下的chi(子)元素 集合元素
$("prev+next") 选取紧接在prev元素后的next元素 集合元素
$("prev~sibings") 选取prev元素之后的所有siblings元素 集合元素
3.过滤选择器:
1>基本过滤选择器
选择器 描述 返回
:first 选取第一个元素 单个元素
:last 选取最后一个元素 单个元素
:not(selector) 除出元素给定选择器匹配的元素 集合元素
:even 选取索引是偶数的所有元素 集合元素
:odd 选取索引是奇数的所有元素 集合元素
:eq(index) xq索引等于index的元素 单个元素
:gt(index) 选取索引大于index的元素 集合元素
:lt(index) xq索引小于index的元素 集合元素
:header 选取所有的标题元素 集合元素
:animated 选取当前正在执行动画的元素 集合元素
2>内容过滤选择器
选择器 描述 返回
:contains(text) 选取含有文本内容为text的元素 集合元素
:empty 选取不包含子元素huo文本的空元素 集合元素
:has(selector) 选取含有选择器匹配的元素的元素 集合元素
:parent 选取含有子元素或文本的元素 集合元素
3>可见性过滤选择器
选择器 描述 返回
:hidden 选取所有不可见的元素 集合元素
:visible 选取所有可见的元素 集合元素
4>属性过滤选择器
选择器 描述 返回
[attr] 选取拥有此属性的元素 集合元素
[attr=value] 选取属性的值为value的元素 集合元素
[attr!=value] 选取属性的值不等于value的元素 集合元素
[attr^=value] 选取属性的值为value开始的元素 集合元素
[attr$=value] 选取属性的是为value结束的元素 集合元素
[attr*=value] 选取属性的值含有value的元素 集合元素
[selector1][selector2]... 用复合属性选择器 集合元素
5>子元素过滤选择器
选择器 描述 返回
:nth-child(index/even/odd/eq) 选取父元素下的对应元素 集合元素
:first-child 选取每个父元素的第一个子元素 集合元素
:last-child 选取灭个父元素的最后一个元素 集合元素
:only-chlid 如果某个元素是他父元素的唯一子元素,会将匹配.若有其他字元素 集合元素
则不会被匹配
nth-child()是个很常用的子元素过滤选择器,详细功能如下:
>:nth-child(even)能选取每个父元素下的索引值是偶数的元素
>:nth-child(odd)能选取每个父元素下的索引值是奇数的元素
>:nth-child(2)能选取每个父元素下的索引值等于2 的元素
>:nth-child(3n)能选取每个父元素下的索引值是3的倍数的元素
>:nth-child(3n+1)能选取每个父元素下的索引值是(3n+1)的倍数的元素
6>表单对象属性过滤选择器
选择器 描述 返回
:enabled 选取所有可用元素 集合元素
:disabled 选择所有不可以用元素 集合元素
:checked 选取所有被选中的元素(单,复选框) 集合元素
:selected 选取所有选中的选项元素(下拉列表) 集合元素
4.表单过滤选择器
选择器 描述 返回
:input 选取所有的<input>,<textarea>,<select>,<button>元素 集合元素
:text 选取所有的当行文本框 集合元素
:password 选取所有的密码框 集合元素
:radio 选取所有的单选框 集合元素
:checkbox 选取所有的多选框 集合元素
:submit 选取所有的提交按钮 集合元素
:image 选取所有的图形按钮 集合元素
:reset 选取所有的重置按钮 集合元素
:button 选取所有的按钮 集合元素
:file 选取所有的上传域 集合元素
:hidden 选取所有的不可见元素 集合元素
新手上路,请多指教,万分感激