选择器函数在他们所支持的选择器参数格式上非常灵活,这些参数可以是字符串、& 返回的列表以及下面的情况:
- 一个原始的字符串,例如:
“.foo .bar, .baz .bang”
; - 用空格分隔的字符串列表,例如:
(“.foo” “.bar”)
; - 用逗号分隔的字符串列表,例如:
(“.foo .bar”, “.baz .bang”)
; - 用逗号分队的字符串列表的列表,例如:
((“.foo” “.bar”), (“.baz” “.bang”))
。
一般来说,选择器函数允许占位符(%
),但不允许父引及选择器&
。
selector-nest($selectors…)
selector-nest($selectors…)
,使用$selectors
提供的选择器返回一个相互嵌套的选择器。就像在样式表中使用$selector1 { $selector2 { … } }
一样。
跟大多部选择器函数不一样,selector-nest
允许&
引用父选择,但其不能用于第一个。
selector-nest(".foo", ".bar", ".baz") => .foo .bar .baz
selector-nest(".a .foo", ".b .bar") => .a .foo .b .bar
selector-nest(".foo", "&.bar") => .foo.bar
至少传递一个选择器参数,参数必须是一个字符串、字符串列表或者是一个字符串列表的列表作为&
的返回值。
selector-append($selectors…)
selector-append($selectors…)
:把$selectors
的选择器连接成为一个新的选择器,就像使用$selector1 { &$selector2 { … } }
一样,彼此直接相连,中间没有空格。
selector-append(".foo", ".bar", ".baz") => .foo.bar.baz
selector-append(".a .foo", ".b .bar") => "a .foo.b .bar"
selector-append(".foo", "-suffix") => ".foo-suffix"
selector-extend($selector, $extendee, $extender)
selector-extend($selector, $extendee, $extender)
:$selector
中其一选择器$extendee
被$extender
扩展。
返回$extender
扩展$extendee
后$selector
后的新版本,这个工作就像:
$selector { ... }
$extender { @extend $extendee }
selector-extend(".a .b", ".b", ".foo .bar") => .a .b, .a .foo .bar, .foo .a .bar
selector-replace($selector, $original, $replacement)
selector-replace($selector, $original, $replacement)
:在$selector
中,使用$replacement
替换$original
。
通过使用@extend
然后再将original
选择器丢掉来达到效果,这意味着可以用来做很多先进事情。比如:
selector-replace(".foo .bar", ".bar", ".baz") => ".foo .baz"
selector-replace(".foo.bar.baz", ".foo.baz", ".qux") => ".bar.qux"
selector-unify($selector1, $selector2)
selector-unify($selector1, $selector2)
:把两个选择器参数统一为一个新选择器,这个新选择器匹配的元素也能匹配这两个选择器参数。
selector-unify(".a", ".b") => .a.b
selector-unify(".a .b", ".x .y") => .a .x .b.y, .x .a .b.y
selector-unify(".a.b", ".b.c") => .a.b.c
selector-unify("#a", "#b") => null
is-superselector($super, $sub)
is-superselector($super, $sub)
:判断$super
是否匹配$sub
匹配的所有元素或者有可能更多。
is-superselector(".foo", ".foo.bar") => true
is-superselector(".foo.bar", ".foo") => false
is-superselector(".bar", ".foo .bar") => true
is-superselector(".foo .bar", ".bar") => false
simple-selectors($selector)
simple-selectors($selector)
:返回一个能包含复合选择器匹配结果的简单选择器。
$selector
必须是复合选择器,不能有空格或逗号,跟其他选择器函数不一样在,他只能是一个字符串,不能是一个列表。
simple-selectors(".foo.bar") => ".foo", ".bar"
simple-selectors(".foo.bar.baz") => ".foo", ".bar", ".baz"
selector-parse($selector)
selector-parse($selector)
: