Injicér nye CSS-regler - CSS-tricks

Anonim

Hvis du har brug for at ændre stilen på et element med JavaScript, er det typisk bedre at ændre et klassenavn og have CSS allerede på siden til at træde i kraft og ændre stilen. Der er dog undtagelser fra hver regel. For eksempel vil du måske programmatisk ændre pseudoklassen (f.eks. :hover). Du kan ikke gøre det via JavaScript af samme grund, at integrerede style=""attributter ikke kan ændre pseudoklasser.

Du bliver nødt til at indsprøjte et nyt element på siden med de korrekte stilarter. Bedst at injicere den nederst på siden, så den tilsidesætter din CSS over den. Let med jQuery:

function injectStyles(rule) ( var div = $(" ", ( html: '-' + rule + '' )).appendTo("body"); )

Anvendelse

injectStyles('a:hover ( color: red; )');

Demo

Mere information

  • Stilindsprøjtningsproblemer i IE (Ryan Seddon).
  • Stak overløbstråd.