外链式等规则）

添加CSS的方式有行内式、嵌入式、外链式、导入式
a）动态引入样式表文件：
复制代码代码如下:
function loadLink（url）{
var link = document.createElement（"link"）;
link.type = "text/css";
link.rel = "stylesheet";
link.href = url;
var head = document.getElmentsByTagName（"head"）[0];
head.appendChild（link）;
}

b）嵌入式：
复制代码代码如下:
function insertStyles（）{
var doc,cssCode=[],cssText;
var len = arguments.length;
var head,style,firstStyle;
if（len == 1）{
doc = document;
cssCode.push（arguments[0]）
}else if（len == 2）{
doc = arguments[0];
cssCode.push（arguments[1]）;
}else{
alert（"函数最多接收两个参数！"）;
}
head = doc.getElementsByTagName（"head"）[0];
styles= head.getElementsByTagName（"style"）;
if（styles.length == 0）{
if（doc.createStyleSheet）{//ie
doc.createStyleSheet（）;
}else{//FF
var tempStyle = doc.createElement（"style"）;
tempStyle.setAttibute（"type","text/css"）;
head.appendChild（tempStyle）;
}
}
firstStyle = styles[0];
cssText=cssCode.join（" "）;
if（！+"v1"）{//opacity兼容
var str = cssText.match（/opacity:（d？.d+）;/）;
if（str！=null）{
cssText = cssText.replace（str[0],"filter:alpha（opacity="+pareFloat（str[1]）*100+"）"）;
}
}
if（firstStyle.styleSheet）{
firstStyle.styleSheee.cssText += cssText;
}else if（doc.getBoxObjectFor）{
firstStyle.innerHTML += cssText;
}else{
firstStyle.appendChild（doc.createTextNode（cssText））;
}
}

c）行内式：
复制代码代码如下:
var addStyle=function （ele,str）{
var s = ele.getAttribute（"style"）,styles;
if（str && typeof str === "string"）{
if（！s）{
ele.style.cssText = str;
}else{
if（s == "[object]"）{//IE6/7 e.getAttribute（"style"）返回[object]
s=ele.style.cssText;
}
styles= trim（s）.split（";"）;
for （var i=0,len=styles.length; i<len; i++）{
var style_i=trim（styles[i]）;
var attr=style_i.split（":"）[0];
if（str.indexOf（attr）>-1）{
styles[i]="";
}else{
styles[i]=style_i;
}
}
ele.style.cssText= styles.join（""）+";"+str;
}
}
}

d）导入式：
import "index.css";
操作CSS 类相关的方法：
复制代码代码如下:
var hasClass=function（ele,value）{
var rclass = /[ ]/g,
value=" "+value+" ";
return （ele.nodeType==1）&&（" "+ele.className+" "）.replace（rclass," "）.indexOf（value）>-1;
}
var trim=function （val）{
return val.replace（/（^s+）|（s+$）/g,""）;
}
var addClass=function（ele,value）{
var rspace = /s+/,classNames,getClass;
if（value&&typeof value === "string"）{
classNames = value.split（rspace）;
if（ele.nodeType === 1）{
if（！ele.className && classNames.length == 1）{
ele.className = value;
}else{
getClass = " "+ele.className+" ";
for（var i=0,len=classNames.length; i<len ;i++）{
var cname=classNames[i];
if（！hasClass（ele,cname））{
getClass += cname+" ";
}
}
ele.className = trim（getClass）;
}
}
}
}
var removeClass=function（ele,value）{
var rclass = /[ ]/g,classNames,getClass;
if（（value&&typeof value === "string"）||value === undefined）{
classNames = （value||""）.split（rspace）;
if（ele.nodeType === 1 && ele.className）{
if（value）{//存在查找要移除的类
getClass = " "+ele.className+" ".replace（rclass," "）;//左右空格，为了使类中各类间均等，方便后面替换
for（var i=0,len=classNames.length; i<len; i++）{
getClass = getClass.replace（" "+classNames[i]+" "," "）
}
ele.className=trim（getClass）;
}else{//不存在移除所有类
ele.className = "";
}
}
}
}
var toggleClass=function（ele,value）{
if（typeof value === "string"）{
if（hasClass（ele,value））{
removeClass（ele,value）;
}else{
addClass（ele,value）;
}
}
}