Как запустить CSS "зависание" с помощью Javascript?

"зависающее состояние" CSS будет срабатывать, когда пользователь наводится на элемент:

<style>
.element{

}
.element:hover{
    background-color:red;
}
</style>

Как мы можем установить элемент в "зависающее состояние" с помощью Javascript?

Возможно ли это?

Ответ 1

Если вы можете использовать :focus вместо зависания, вы можете использовать:

var links = document.getElementsByTagName('a');
links[0].focus();

JS Fiddle demo.

или

var linkToFocus = document.getElementById('link');
linkToFocus.focus();

JS Fiddle demo.

Этот подход, очевидно, требует адаптации CSS для включения стиля a:focus:

a:link, a:visited {
    background-color: #fff;
}
a:hover, a:focus, a:active {
    background-color: #f00;
}

Ответ 2

Вам, вероятно, лучше не дублировать стили: hover в другом классе, а затем просто добавлять это имя класса к элементу, когда вы хотите, чтобы они постоянно менялись. Псевдо-классы "псевдо" по какой-то причине.