Добавить класс В Javascript?


Как добавить класс <html> корневой элемент с помощью Javascript?

6 58

6 ответов:

такой:

var root = document.getElementsByTagName( 'html' )[0]; // '0' to assign the first (and only `HTML` tag)

root.setAttribute( 'class', 'myCssClass' );

или используйте это в качестве строки "сеттер", чтобы сохранить любые ранее примененные классы: (спасибо @ama2)

root.className += ' myCssClass';

или, в зависимости от необходимой поддержки браузера, вы можете использовать classList.add() способ:

root.classList.add('myCssClass');

https://developer.mozilla.org/en-US/docs/Web/API/Element/classList http://caniuse.com/#feat=classlist

обновление:

более шикарное разрешение для ссылаться HTML элемент может быть такой:

var root = document.documentElement;
root.className += ' myCssClass';
// ... or:
//  root.classList.add('myCssClass');
//

Это должно работать:

document.documentElement.className = 'myClass'​​​​;

совместимость.

Edit:

IE 10 считает, что это только для чтения; но:

It worked!?

Опера работает:

Works

Я также могу подтвердить, что он работает в:

  • Chrome 26
  • Firefox 19.02
  • Safari 5.1.7

Я бы рекомендовал вам взглянуть на jQuery.

jQuery way:

$("html").addClass("myClass");

вы должны добавить класс не заменить его

var headCSS = document.getElementsByTagName("html")[0].getAttribute("class") || "";
document.getElementsByTagName("html")[0].setAttribute("class",headCSS +"foo");

Я бы все-таки рекомендовал использовать jQuery, чтобы избежать несовместимости браузера

document.documentElement.classList.add('myCssClass');

С Jquery... Вы можете добавить класс в html-элементы следующим образом:

$(".divclass").find("p,h1,h2,h3,figure,span,a").addClass('nameclassorid');

nameclassorid нет точки или # в начале