easy

DocsVersion : 1.0.0

选择器模块

Define in : selector.js

任何 DOM 元素操作都是从选择一个 DOM 元素开始的,可见选择器的重要性。如果你想了解选择器的工作原理,可以看看javascript选择器的那些事儿

easy.js 的选择器在性能上绝对不会逊色于那些主流的 JavaScript 框架。这里提供了一个选择器性能测试的页面,请使用IE6/7进行测试,标准浏览器测试的是浏览器本身对 querySelector 方法的速度,意义不大。

easy.js 的选择器尽量和 W3C 的标准保持一致,另外也添加了几个很有用的非标准的私有选择器,具体的支持情况请看下面的列表。

方法
containsstatic
filterstatic
querystatic
uniquestatic
类型 表达式 CSS标准 说明
基本 E 1

标签选择器。

E#myid 1

id选择器。

E.class 1

class选择器。

关系 E F 1

后代元素选择器,E 的后代元素 F。

E > F 2

子级元素选择器,E 的 child 元素 F。

E + F 2

相邻元素选择器,紧邻 E 的 nextSibling 元素 F。

E ~ F 3

同级元素选择器,E 之后的所有 nextSibling 元素中的 F。

属性 E[attr] 2

有 attr 属性的元素。

E[attr="value"] 2

有 attr 属性,属性值为 value 的元素。

E[attr!="value"] 非标准

有 attr 属性,属性值不为 value 的元素。

E[attr~="value"] 2

有 attr 属性,属性值包含 value 单词( 单词的特征是会有空格分隔 )的元素。

E[attr*="value"] 3

有 attr 属性,属性值包含了 value 字符串的元素。

E[attr^="value"] 3

有 attr 属性,属性值以 value 为开头的元素。

E[attr$="value"] 3

有 attr 属性,属性值以 value 为结尾的元素。

E[attr|="value"] 3

有 attr 属性,属性值是 value,或者属性值是以 value- 为开头的元素。

索引伪类 E:nth-child(n) 3

E 的所有同级元素,并且符合 n 过滤规则的元素,查找顺序是从第一个子元素到最后一个子元素。

E:nth-last-child(n) 3

E 的所有同级元素,并且符合 n 过滤规则的元素,查找顺序是从最后一个子元素到第一个子元素。

E:nth-of-type(n) 3

E 的所有同级同标签类型元素,并且符合 n 过滤规则的元素,查找顺序是从第一个子元素到最后一个子元素。

E:nth-last-of-type(n) 3

E 的所有同级同标签类型元素,并且符合 n 过滤规则的元素,查找顺序是从最后一个子元素到第一个子元素。

E:first-child 2

第一个 E 的同级元素,查找顺序是从第一个子元素到最后一个子元素。

E:last-child 3

最后一个 E 的同级元素,查找顺序是从最后一个子元素到第一个子元素。

E:first-of-type 3

第一个 E 的同级同标签类型元素,查找顺序是从第一个子元素到最后一个子元素。

E:last-of-type 3

最后一个 E 的同级同标签类型元素,查找顺序是从最后一个子元素到第一个子元素。

其他伪类 E:only-child 3

E 是唯一一个子元素。

E:only-of-type 3

E 是同级元素中唯一一个该标签类型的元素。

E:empty 3

无子元素( 文本元素也算 )的 E 元素。

E:not(s) 3

E 元素中非 s 的元素,s 为过滤选择器。

E:hidden 非标准

隐藏的 E 元素。

E:visible 非标准

可见的 E 元素。

E:animated 非标准

正在进行动画的 E 元素。

表单伪类 E:enabled 3

可用的 E 元素。

E:disabled 3

不可用的 E 元素。

E:checked 3

checkbox、radio 中被选中的 E 元素。

E:selected 非标准

select 中被选中的 option 元素。

关于索引选择器的参数 n 的过滤规则

n 可以是一个纯索引值,如果是从第一个元素开始查找,索引就是从1开始,如果是从最后一个元素开始查找,索引就是从 length 开始。

n 为 odd,表示查找基数索引的元素。

n 为 even,表示查找偶数索引的元素。

3n 表示查找能被3整除的索引的元素。

2n+1 查找第一个索引元素,并且从第一个开始查找能被2整除的索引的元素。

3n-1 查找第(-1)个索引元素,并且从第(-1)个开始查找能被3整除的索引的元素。

如果你还是不太理解,可以自己尝试下写各种语法就很好理解了。