Можно ли задать класс CSS элемента с помощью JavaScript?

Да, это работает (с именем класса в виде строки, как упоминал Джона). Кроме того, вы можете установить атрибуты стиля непосредственно на объекте, используя интерфейс Стиль DOM уровня 2. например.,

button.style.fontFamily = "Verdana, Arial, sans-serif";

где button (предположительно) объект-кнопка. :-)

Если e является ссылкой на элемент DOM и у вас есть такой класс: .t {color:green;}, тогда вы хотите ссылаться на имя класса в виде строки:

e.className = 't';

Это не только работает, но и является лучшей практикой.

Вы определенно хотите отделить формат данных (xHTML) от дизайна (CSS) и поведения (javascript).

Поэтому гораздо лучше просто добавлять и удалять классы в JS в соответствии с событием, в то время как эстетические проблемы делегируются стилям css.

НАПР .: Окрашивание сообщения об ошибке в красный цвет.

CSS

.error
{
    color: red;
}

JS

var error=document.getElementById('error');
error.className='error';

Примечание:

• Этот фрагмент - всего лишь пример. В реальной жизни для этого можно использовать js.
• document.getElementById не всегда совместим. Лучше использовать JS-фреймворк, чтобы справиться с этим. Я лично использую JQuery.

Вот пример добавления и удаления класса с помощью jQuery.

// js
  $("p:first").addClass("t");
  $("p:first").removeClass("t");

// css
  .t {
    backgound: red
  }