js 设置css样式的几种方法

js动态设置样式:

　　1: 直接设置Style对象：

　　　　el.style.color = '#b50029';
　　　　el.style.fontSize = '30px';
　　　　el.style['font-size'] = '30px';

　　　　

 

　　2:设置style属性：

　　　  【2.1】el.setAttribute('style', 'color: red;');
　　　　           el.setAttribute('style', 'font-size: 30px');

　　　　

　　　 【2.2】el.setAttribute('style', 'font-size: 30px');

　　　　

　　　 【2.3】el.setAttribute('style',
　　　　　　　　 　　　　   'color: red;' + 'font-size: 30px;' + 'background-color: green');

　　　　

　　3:设置cssText

　　【3.1】el.style.cssText = "color: red;font-size: 30px";

　　

　　【3.2】el.style.cssText = "color: red;font-size: 30px";
　　　　     el.style.cssText += 'background-color: yellow';

　　　

　　【3.3】el.style.cssText = "color: red;font-size: 30px";
　　　　     el.style.cssText += 'background-color: yellow';
　　　　     el.style.cssText = "text-decoration: line-through";

　　

　　4：改变class类名　

　　　　【4.1】el.className = 'cNone';
　　　　            el.className += 'cNtwo';　>> el[class="cNone cNtwo"]

　　　　【4.2】el.className = 'cNone';
　　　　            el.className = 'cNtwo';      >>el[class="cNtwo"]

 

参考：
http://www.cnblogs.com/susufufu/p/5749922.html
http://javascript.ruanyifeng.com/dom/css.html
http://www.cnblogs.com/LiuWeiLong/p/6058059.html