Injicera nya CSS-regler - CSS-tricks

Anonim

Om du behöver ändra stilen för ett element med JavaScript är det oftast bättre att ändra ett klassnamn och ha CSS redan på sidan och ändra stil. Det finns dock undantag från varje regel. Du kanske till exempel vill ändra pseudoklassen (t.ex. :hover). Du kan inte göra det via JavaScript av samma anledning att integrerade style=""attribut inte kan ändra pseudoklasser.

Du måste injicera ett nytt element på sidan med rätt stilar. Bäst att injicera den längst ner på sidan så att den åsidosätter din CSS ovanför den. Enkelt med jQuery:

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

Användande

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

Demo

Mer information

  • Stilinjektionsegenskaper i IE (Ryan Seddon).
  • Stack överflödstråd.