封装link或style中的css规则

      CSSStyleSheet类型表示的是样式表，包括通过<link>元素包含的样式表和在<style>元素中定义的样式表。这两个元素本身分别是由HTMLLinkElement和HTMLStyleElement类型表示的。但是，CSSStyleSheet类型相对更加通用一些，它只表示样式表，而不管这些样式表在HTML中是如何定义的。此外，上述两个针对元素的类型允许修改HTML特性，但CSSStyleSheet对象则是一套只读的接口。使用下面的代码可以确定浏览器是否支持DOM2级样式表。

var supportsDOM2StyleSheets = document.implementation.hasFeature("StyleSheets", "2.0");

CSSStyleSheet继承自StyleSheet，后者可以作为一个基础接口来定义非CSS样式表。从StyleSheet接口继承而来的属性如下。

• disabled：表示样式表是否被禁用的布尔值。这个属性是可读/写的，将这个值设置为true可以禁用样式表。
• href：如果样式表是通过<link>包含的，则是样式表的URL；否则，是null。
• media：当前样式表支持的所有媒体类型的集合。与所有DOM集合一样，这个集合也有一个length属性和一个item()方法。也可以使用方括号语法取得结合中特定的项。如果集合是空列表项，表示样式表适用于所有媒体。在IE中，media是一个反映<link>和<style>元素media特性的字符串。
• ownerNode：指向拥有当前样式表的节点的指针，样式表可能是在HTML中通过<link>或<style>引入的。如果当前样式表是其它样式表通过@import导入的，则这个属性值为null。IE不支持这个属性。
• parentStyleSheet：在当前样式表是通过@import导入的情况下，这个属性是一个指向导入它的样式表的指针。
• title：ownerNode中的title属性的值。
• type：表示样式表类型的字符串。对CSS样式表而言，这个字符串是“type/css”。

除了disabled属性之外，其它属性都是只读的。在支持以上所有这些属性的基础上，CSSStyleSheet类型还支持下列属性和方法：

• cssRules：样式表中包含的样式规则的集合。IE不支持这个属性，但有一个类似的rules属性。
• ownerRule：如果样式表是通过@import导入的，这个属性就是一个指针，指向表示导入的规则；否则，值为null。IE不支持这个属性。
• deleteRule(index)：删除cssRules集合中指定的位置的规则。IE不支持这个方法，但支持一个类似的removeRule()方法。
• insertRule(rule,index)：向cssRules集合中指定的位置插入rule字符串。IE不支持这个方法，但支持一个类似的addRule()方法。

应用于文档的所有样式表是通过document.styleSheets集合来表示。

不同浏览器的document.styleSheets返回的样式表也不同。所有浏览器都会包含<style>元素和rel特性被设置为“stylesheet”的<link>元素引入的样式表。IE和Opera也包含rel特性被设置为“alternate stylesheet”的<link>元素引入的样式表。

也可以直接通过<link>或<style>元素取得CSSStyleSheet对象。DOM规定了一个包含CSSStyleSheet对象的属性，名叫sheet；除了IE，其它浏览器都支持这个属性。IE支持的是styleSheet属性。

具体封装代码是：

//添加link或style的CSS规则
Base.prototype.addRule = function (num, selectorText, cssText, position) {
	var sheet = document.styleSheets[num];
	if (typeof sheet.insertRule != 'undefined') {//W3C
		sheet.insertRule(selectorText + '{' + cssText + '}', position);
	} else if (typeof sheet.addRule != 'undefined') {//IE
		sheet.addRule(selectorText, cssText, position);
	}
	return this;
}

//移除link或style的CSS规则
Base.prototype.removeRule = function (num, index) {
	var sheet = document.styleSheets[num];
	if (typeof sheet.deleteRule != 'undefined') {//W3C
		sheet.deleteRule(index);
	} else if (typeof sheet.removeRule != 'undefined') {//IE
		sheet.removeRule(index);
	}
	return this;
}