javascript_操作样式

styleSheets

用styleSheets获取样式集合（包括link中的和style中的，都兼容）

var sheet = document.styleSheets // 获取样式集合

    var data = document.styleSheets;        // 返回一个样式表集合
    var rules = data[0].cssRules;           // 返回第一个样式中的规则集合
    alert(data.length);                     // 2 获取样式表的数量
    alert(rules.length);                    // 2 获取样式表中规则的数量    

disabled 禁用指定样式表（true表示禁用样式）

    var data = document.styleSheets[0];     // 获取第一个样式表
    data.disabled = true;                   // 禁用第一个样式表

href 获取样式的URL

document.write(data.href);
效果:  <i><b>file:///D:/Code/HTML/JavaScript/CSS/js_style.css</b></i>

cssRules 样式表规则集合（IE用rules）

只能获得style标签中的样式

cssRules.cssText 获得css文本
selectorText 获得选择符

    var data = document.styleSheets;    // 获取样式集合
    var rules = data[0].cssRules;       // 获取规则集合
    alert(rules.length);                // 获取规则数量
    alert(rules[0].cssText);            // 获取第一条规则的css代码
    alert(rules[0].selectorText);       // 获取第一条规则的选择器名

添加和删除规则

deleteRule(num) 删除第num条规则（IE用removeRule）
insertRule(“样式”，num) 插入样式（IE 用addRule(“标签”,”样式”,num)）


var data = document.styleSheets[0];
data.deleteRule(0); // 删除样式
data.insertRule("body{background-color:red;}",0); // 添加样式


style

    var data = document.styleSheets[0];
    var rules = data.cssRules;
    alert(rules[0].style.backgroundColor);  //orange
    rules[0].style.backgroundColor = "blue";    // 更改背景色为blue

这一部分内容有很多的兼容性问题，以后再做研究