JS修改CSS

JS修改CSS

jQuery可以方便地修改CSS， 如果不用jQuery，JS可以通过以下方法改变元素的CSS。

方法1

直接改变class名，这种方法适用于已经有定义好的class，如果没有class，则需要先创建class。

Example:

var div = document.createElement("div"); 
div.className = "class-name";

方法2

通过style属性直接改变样式。

Example:

var div = document.createElement("div");
div.style.width = "400px";

style属性可以参考：
http://www.w3school.com.cn/jsref/dom_obj_style.asp

方法3

通过设置 style 的 cssText 属性来改变

cssText 属性

它是一组样式属性及其值的文本表示。这个文本格式化为一个 CSS 样式表，去掉了包围属性和值的元素选择器的花括号。

将这一属性设置为非法的值将会抛出一个代码为 SYNTAX_ERR 的 DOMException 异常。当 CSS2Properties 对象是只读的时候，试图设置这一属性将会抛出一个代码为 NO_MODIFICATION_ALLOWED_ERR 的 DOMException 异常。

Example:

var div = document.createElement("div");
div.style.cssText = 'cssText = "width: 400px; height: 90px;"'