Sass 選擇器函式
Sass 選擇器函式
選擇器函式用於檢查和操作選擇器。
下表列出了 Sass 中的所有選擇器函式:
函式 | 描述 & 示例 |
---|---|
is-superselector(super, sub) | 檢查 super 選擇器是否匹配 sub 匹配的所有元素。 示例 is-superselector("div", "div.myInput") 結果: true is-superselector("div.myInput", "div") 結果: false is-superselector("div", "div") 結果: true |
selector-append(selectors) | 將第二個(以及第三個/第四個等)選擇器附加到第一個選擇器。 示例 selector-append("div", ".myInput") 結果:div.myInput selector-append(".warning", "__a") 結果:.warning__a |
selector-extend(selector, extendee, extender) | |
selector-nest(selectors) | 根據提供的列表返回一個包含 CSS 選擇器巢狀列表的新選擇器。 示例 selector-nest("ul", "li") 結果:ul li selector-nest(".warning", "alert", "div") 結果:.warning div, alert div |
selector-parse(selector) | 使用與父選擇器相同的格式返回 selector 中包含的字串列表。 示例: selector-parse("h1 .myInput .warning") 結果:('h1' '.myInput' '.warning') |
selector-replace(selector, original, replacement) | 返回一個新選擇器,其中 replacement 中指定的選擇器替換 original 中指定的選擇器。 示例 selector-replace("p.warning", "p", "div") 結果:div.warning |
selector-unify(selector1, selector2) | 返回一個新選擇器,該選擇器僅匹配 selector1 和 selector2 都匹配的元素。 示例 selector-unify("myInput", ".disabled") 結果:myInput.disabled selector-unify("p", "h1") 結果:null |
simple-selectors(selectors) | 返回 selectors 中各個選擇器的列表。 示例 simple-selectors("div.myInput") 結果:div, .myInput simple-selectors("div.myInput:before") 結果:div, .myInput, :before |