Внедрить новые правила CSS - CSS-хитрости

Anonim

Если вам нужно изменить стиль элемента с помощью JavaScript, обычно лучше изменить имя класса, чтобы CSS уже на странице вступил в силу и изменил стиль. Однако из каждого правила есть исключения. Например, вы можете захотеть программно изменить псевдокласс (например :hover). Вы не можете сделать это с помощью JavaScript по той же причине, по которой встроенные style=""атрибуты не могут изменять псевдоклассы.

Вам нужно будет добавить на страницу новый элемент с правильными стилями. Лучше всего вставить его внизу страницы, чтобы он переопределил ваш CSS над ним. Легко с jQuery:

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

использование

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

Демо

Дополнительная информация

  • Причуды внедрения стиля в IE (Райан Седдон).
  • Тема переполнения стека.