selektorer

Selektorer er mønstre brukt i stilark og skript for å identifisere elementer i et dokument og målrette dem for styling eller manipulering. I HTML- og XML-dokumenter gjør de det mulig å velge hvilke elementer som skal få regler eller endres av JavaScript. De kan være enkle eller komplekse og bygges opp av kombinasjoner av typer, klasser, ID-er og attributter, samt tilstander og posisjoner i dokumentet.

De grunnleggende typene inkluderer typevelgeren, som velger elementer etter navn (for eksempel h1), klassevelgeren (.innhold), ID-velgeren (#overskrift) og universalvelgeren (*) som velger alle elementer. Attributtvelgere som [href] eller [type="text"] lar deg målrette elementer basert på attributter. Pseudo-klasser som :hover, :focus, :nth-child(2) og :first-child identifiserer tilstander i dokumentet. Pseudo-elementer som ::before og ::after lar deg sette inn innhold relatert til et element.

Kombinatorer lar deg spesifisere forhold mellom elementer: mellomrom representerer descendent-forhold, > angir direkte barn, + angir det direkte neste søskenet, og ~ angir senere søsken. Spesifisiteten til velgeren bestemmer hvilke regler som gjelder hvis flere regler påvirker samme element. I praksis brukes selektorer i CSS for å tildele stilregler og i JavaScript via metoder som querySelector og querySelectorAll. En god praksis er å bruke meningsfulle klasser og unngå for kompliserte velgere for bedre ytelse og vedlikehold.