动态加载CSS文件，这个时常会用到，一般搞前端，我们最先想到的就是用JS来实现，的确，JS可以很方便的控制CSS样式表文件的动态插入，以下两种方法：使用<style>标签插入页面样式、在页面中动态引入外部样式，都是动态加载CSS的常用方法。
一、使用<style>标签插入页面样式
这点采用了YUI插件中的一个方法，有效解决了各大浏览器的兼容性问题，主要是使用style.appendChild(document.createTextNode(styles));采用createTextNode将CSS代码添加到<style>标签内，看代码：
<script>
function includeStyleElement(styles,styleId) {
if (document.getElementById(styleId)) {
return
}
var style = document.createElement("style");
style.id = styleId;
//为ie设置属性
/*if (isIE()) {
style.type = "text/css";
style.media = "screen"
}*/
(document.getElementsByTagName("head")[0] || document.body).appendChild(style);
if (style.styleSheet) { //for ie
style.styleSheet.cssText = styles;
} else {//for w3c
style.appendChild(document.createTextNode(styles));
}
}
var styles = "#div{background-color: #FF3300; color:#FFFFFF }";
includeStyleElement(styles,"newstyle");
</script>这样页面中的元素就能直接应用样式了，不管你的这些元素是不是通过脚本追加的。
二、页面中引入外部样式：
在<head>中使用<link>标签引入一个外部样式文件，这个方法相对简单，而且也不存在浏览器的兼容性问题，看代码：
<script>
function includeLinkStyle(url) {
var link = document.createElement("link");
link.rel = "stylesheet";
link.type = "text/css";
link.href = url;
document.getElementsByTagName("head")[0].appendChild(link);
}
includeLinkStyle("/css/reset.cssv=20140222"
</script>如果使用的样式比较少，这种方法似乎有些小题大做了，仅供参考吧。
