Как я могу установить CSS: "hover" на элемент, созданный DOM в JavaScript?

Question

Я использую DOM для управления ответом JSON от выполняемой мной функции AJAX. Сценарий, который я пишу, должен быть полностью переносимым, поэтому я на лету определяю стили для созданных элементов (то есть не имею ссылки на внешний CSS и не предоставляю CSS в самом HTML-документе, потому что не буду иметь контроль над документом).

Я бы хотел создать эффект наведения на некоторые элементы.

пример:

 #myDiv:hover { background:#000000; }

Есть ли способ определить это в DOM? Или я должен использовать mouseover?

Answer 1

Вы можете динамически создавать и управлять таблицами стилей. См. Здесь для некоторых кросс-браузерных проблем с этим подходом.

У меня есть функция-обертка , лежащая вокруг , которая работает вокруг некоторых из них; используя его, код будет читать

document.createStyleSheet().addRule('#myDiv:hover', 'background:#000000;');

Answer 2

вы можете создать элемент с предопределенным классом:

.h:hover{color: #c00}

var elem = document.createElement('div');
elem.className = 'h'