Предположим, что элемент HTML id известен, поэтому элемент может быть реферирован, используя:
document.getElementById(element_id);
Существует ли встроенная функция Javascript, которая может быть использована для добавления класса CSS к этому элементу?
var element = document.getElementById(element_id);
element.className += " " + newClassName;
Вуаля. Это будет работать почти во всех браузерах. Ведущее пространство важно, поскольку свойство className рассматривает классы css как одну строку, которая должна соответствовать атрибуту class для элементов HTML (где несколько классов должны быть разделены пробелами).
Кстати, вам будет лучше использовать библиотеку Javascript, например prototype или jQuery, которые имеют методы для этого, а также функции, которые могут сначала проверить, имеет ли элемент уже назначенный класс.
В прототипе, например:
// Prototype automatically checks that the element doesn't already have the class
$(element_id).addClassName(newClassName);
Посмотрите, что лучше?!
classList - удобная альтернатива доступу к списку классов элементов. см. http://developer.mozilla.org/en-US/docs/Web/API/Element.classList. p >
Не поддерживается в IE < 10
Когда элемент уже имеет определенное имя класса, его влияние на элемент привязывается к его позиции в строке имен классов. Более поздние классы переопределяют более ранние, если есть конфликт.
Добавление класса к элементу должно переместить имя класса в острый конец списка, если он уже существует.
document.addClass= function(el, css){
var tem, C= el.className.split(/\s+/), A=[];
while(C.length){
tem= C.shift();
if(tem && tem!= css) A[A.length]= tem;
}
A[A.length]= css;
return el.className= A.join(' ');
}
Вы должны иметь возможность установить свойство className элемента. Вы можете сделать + =, чтобы добавить его.
addClass=(selector,classes)=>document.querySelector(selector).classList(...classes.split(' '));
Это добавит классы ONE или MULTIPLE:
addClass('#myDiv','back-red'); // => Add "back-red" class to <div id="myDiv"/>
addClass('#myDiv','fa fa-car') //=>Add two classes to "div"