用Javascript添加类到<html>?
你如何添加一个类到使用Javascript的<html>
根元素?
喜欢这个:
var root = document.getElementsByTagName( 'html' )[0]; // '0' to assign the first (and only `HTML` tag) root.setAttribute( 'class', 'myCssClass' );
或者使用这个作为你的'setter'行来保存任何以前应用的类:(thanks @ 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
元素的更优雅的解决scheme可能是这样的:
var root = document.documentElement; root.className += ' myCssClass'; // ... or: // root.classList.add('myCssClass'); //
这也应该工作:
document.documentElement.className = 'myClass';
兼容性 。
编辑:
IE 10认为它是只读的; 然而:
歌剧作品:
我也可以确认它适用于:
- Chrome 26
- Firefox 19.02
- Safari 5.1.7
我build议你看看jQuery 。
jQuery的方式:
$("html").addClass("myClass");
你应该追加类不覆盖它
var headCSS = document.getElementsByTagName("html")[0].getAttribute("class") || ""; document.getElementsByTagName("html")[0].setAttribute("class",headCSS +"foo");
我仍然build议使用jQuery来避免浏览器不兼容
document.documentElement.classList.add('myCssClass');
用Jquery …你可以添加类到这样的html元素:
$(".divclass").find("p,h1,h2,h3,figure,span,a").addClass('nameclassorid');
nameclassorid没有点或#在开始