Funciones de selector Sass

Funciones de selector Sass

Selector functions are used to check and manipulate selectors.

The following table lists all selector functions in Sass:

function description & example
is-superselector(super, sub)

check super whether the selector matches sub all elements that match.

Ejemplo:

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

result: true

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

result: false

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

result: true

selector-append(selectores)

attaches the second (and third/fourth, etc.) selector to the first selector.

Ejemplo:

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

result: div.myInput

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

result: .warning__a

selector-extend(selector, extendee, extender)
selector-nest(selectores)

returns a new selector with a nested list of CSS selectors based on the provided list.

Ejemplo:

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

result: ul li

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

result: .warning div, alert div

selector-parse(selector)

returns a list of strings contained in the selector using the same format as the parent selector.

Ejemplo:

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

result: ('h1' '.myInput' '.warning')

selector-replace(selector, original, reemplazo)

devuelve un nuevo selector, usando reemplazo reemplazando el selector especificado original selector especificado.

Ejemplo:

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

Resultados: div.warning

selector-unify(selector1, selector2)

devuelve un nuevo selector que solo coincide con selector1 y selector2 elementos que coinciden.

Ejemplo:

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

Resultados: myInput.disabled

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

Resultados: null

simple-selectors(selectores)

Volver selectores lista de todos los selectores.

Ejemplo:

simple-selectors("div.myInput")

Resultados: div, .myInput

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

Resultados: div, .myInput, :before