Funkcje selektorów Sass

Funkcje selektorów Sass

Funkcje selektorów służą do sprawdzania i operowania na selektorach.

Poniższa tabela zawiera wszystkie funkcje selektorów w Sass:

Funkcja Opis & przykład
is-superselector(super, sub)

Sprawdź super Czy selektor pasuje? sub Wszystkie elementy, które pasują.

Przykład:

is-superselector("div", "div.myInput")

Wynik: true

is-superselector("div.myInput", "div")

Wynik: false

is-superselector("div", "div")

Wynik: true
selector-append(selektory)

Dodaje drugi (i trzeci/czwarty itp.) selektor do pierwszego selektora.

Przykład:

selector-append("div", ".myInput")

Wynik: div.myInput

selector-append(".warning", "__a")

Wynik: .warning__a
selector-extend(selector, extendee, extender)
selector-nest(selektory)

Zwraca nowy selektor zawierający listę selektorów wstawionych węzłami CSS.

Przykład:

selector-nest("ul", "li")

Wynik: ul li

selector-nest(".warning", "alert", "div")

Wynik: .warning div, alert div
selector-parse(selector)

Zwraca listę ciągów znaków zawartych w selektorze, używając formatu takiego jak format selektora nadrzędnego.

Przykład:

selector-parse("h1 .myInput .warning")

Wynik: ('h1' '.myInput' '.warning')
selector-replace(selector, oryginal, zastąp)

zwróć nowy selektor, używając zastąp zastąp określonym selektorem oryginal z określonym selektorem.

Przykład:

selector-replace("p.warning", "p", "div")

Wynik: div.warning
selector-unify(selector1, selector2)

zwróć nowy selektor, który pasuje tylko do selector1 i selector2 elementy, które pasują do obu.

Przykład:

selector-unify("myInput", ".disabled")

Wynik: myInput.disabled

selector-unify("p", "h1")

Wynik: null
simple-selectors(selektory)

zwróć selektory lista wszystkich selektorów.

Przykład:

simple-selectors("div.myInput")

Wynik: div, .myInput

simple-selectors("div.myInput:before")

Wynik: div, .myInput, :before