JavaScript动态插入script

更多原创技术博文，请访问本人独立技术博客：蓝克比尔

在日常的前端开发中，偶尔有需要动态插入javascript代码的需求，基本思路是：

1、动态创建一个script标签，设置其src属性，type属性等

2、将script节点插入页面，加载js文件

即相当于将<script type="text/javascript" src="xxx.js"></script>添加到了页面，只不过这个过程是动态完成的，为此特意封装了一个函数来实现：

// 动态插入script标签function createScript(url, callback){var oScript = document.createElement('script');oScript.type = 'text/javascript';oScript.async = true;oScript.src = url;/*** script标签的onload和onreadystatechange事件** IE6/7/8支持onreadystatechange事件** IE9/10支持onreadystatechange和onload事件** Firefox/Chrome/Opera支持onload事件*/// 判断IE8及以下浏览器var isIE = !-[1,];if(isIE){alert('IE')oScript.onreadystatechange = function(){if(this.readyState == 'loaded' || this.readyState == 'complete'){callback();}}} else {// IE9及以上浏览器，Firefox，Chrome，OperaoScript.onload = function(){callback();}}document.body.appendChild(oScript);}

使用方法如：

createScript('xxx.js', function(){console.log('OK');});

更多原创技术博文，请访问本人独立技术博客：蓝克比尔