标签：匿名 alert browser size als head 脚本 执行函数 事件
JavaScript，动态加载脚本和样式
一动态脚本
当网站需求变大，脚本的需求也逐步变大。我们就不得不引入太多的JS脚本而降低了整站的性能，所以就出现了动态脚本的概念，在适时的时候加载相应的脚本。
比如：我们想在需要检测浏览器的时候，再引入检测文件。
1动态加载js文件
window.onload = function() { //window.onload事件，等待html执行完成后，执行匿名函数 //判断要加载的文件是否加载成功 alert(typeof BrowserDetect); }; //注意：判断加载写在，window.onload外面，也就是先加载代码，不然网页执行后在生成<script>元素标签就连接不了 //设置一个变量，值为true再加载，值为false不加载文件 var flag = true; if (flag) { //判断flag值为真时，执行加载js文件函数 loadScript(‘browserdetect.js‘); } //定义加载js函数，接收一个参数要加载的js我们路径名称 function loadScript(url) { //创建<script>元素标签 var script = document.createElement(‘script‘); //向标签添加属性 script.type = ‘text/javascript‘; //向标签添加属性 script.src = url; //向标签添加属性 script.charset = ‘utf-8‘; //通过标签名称获取到第一个<head>标签，将新创建<script>元素标签添加到<head>标签的子标签末尾 document.getElementsByTagName(‘head‘)[0].appendChild(script); }
2多态加载js代码
//注意：判断加载写在，window.onload外面，也就是先加载代码，不然网页执行后在生成<script>元素标签就连接不了 //设置一个变量，值为true再加载，值为false不加载代码 var flag = true; if (flag) { //判断flag值为真时，执行加载js代码函数 loadScript(); //执行函数 } //定义加载js代码函数， function loadScript() { //创建一个script标签 var script = document.createElement(‘script‘); //向标签添加属性 script.type = ‘text/javascript‘; //向标签添加属性 script.charset = ‘utf-8‘; //要执行的代码 script.text = "alert(‘你好‘)"; //将script标签添加到第一个head标签的子标签末尾 document.getElementsByTagName(‘head‘)[0].appendChild(script); }
PS：当然，如果不支持text，那么就可以针对不同的浏览器特性来使用不同的方法。这里就忽略写法了。
二动态样式
为了动态的加载样式表，比如切换网站皮肤。样式表有两种方式进行加载，一种是<link>标签，一种是<style>标签。
1动态加载css文件
标签：匿名 alert browser size als head 脚本 执行函数 事件
原文地址：http://www.cnblogs.com/adc8868/p/6117151.html
