javascript 动态脚本添加的简单方法


Posted in Javascript onOctober 11, 2016

异步加载js文件或者异步加载js模块,支持所有浏览器,包括IE,参考至javascript高级编程

1.createScript方法用于创建一个script标签并添加到body标签中

2.createModule方法用于创建一个script脚本的标签,并且如果在IE8以下的版本运行会抛出异常,在异常捕获模块中执行script.text兼容IE添加js的脚本内容。

<button id="demo">js文件</button>
  <button id="demo1">js模块</button>
  <script type="text/javascript">
    //异步加载文件,支持所有浏览器
    document.getElementById("demo").onclick = function () {
      createScript("../../js/jquery-1.8.3.min.js");
    }

    function createScript(url) {
      var script = document.createElement("script");
      script.type = "text/javascript";
      script.src = url;
      document.body.appendChild(script);
    }


    //这里首先会尝试标准的DOM方法,因为除了IE(在IE中会抛出错误),所有浏览器都支持这种方法,如果抛出错误则说明是IE,于是就必须使用tezt属性了
    document.getElementById("demo1").onclick = function () {
      createModule("function sayHi(){alert('Hi !')}");
    }

    function createModule(code) {
      var script = document.createElement("script");
      script.type = "text/javascript";
      try {
        script.appendChild(document.createTextNode(code));
      } catch (ex) {
        script.text(code);
      }
      document.body.appendChild(script);
    }
  </script>

以上就是小编为大家带来的javascript 动态脚本添加的简单方法全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
javascript同步Import,同步调用外部js的方法
Jul 08 Javascript
js 单引号 传递方法
Jun 22 Javascript
JS与C#编码解码
Dec 03 Javascript
js实现页面跳转重定向的几种方式
May 29 Javascript
Underscore.js常用方法总结
Feb 28 Javascript
全国省市二级联动下拉菜单 js版
May 10 Javascript
关于webpack代码拆分的解析
Jul 20 Javascript
js处理包含中文的字符串实例
Oct 11 Javascript
原生JS实现网页手机音乐播放器 歌词同步播放的示例
Feb 02 Javascript
vue模仿网易云音乐的单页面应用
Apr 24 Javascript
Vue是怎么渲染template内的标签内容的
Jun 05 Javascript
基于javascript实现放大镜特效
Dec 03 Javascript
js HTML5上传示例代码完整版
Oct 10 #Javascript
JavaScript  event对象整理及详细介绍
Oct 10 #Javascript
快速解决js开发下拉框中blur与click冲突
Oct 10 #Javascript
JavaScript 闭包机制详解及实例代码
Oct 10 #Javascript
Javascript 事件冒泡机制详细介绍
Oct 10 #Javascript
JS 滚动事件window.onscroll与position:fixed写兼容IE6的回到顶部组件
Oct 10 #Javascript
javaScript 事件绑定、事件冒泡、事件捕获和事件执行顺序整理总结
Oct 10 #Javascript
You might like
用PHP动态生成虚拟现实VRML网页
2006/10/09 PHP
PHP去掉从word直接粘贴过来的没有用格式的函数
2012/10/29 PHP
实现PHP搜索加分页
2016/10/12 PHP
PHP自定义函数获取汉字首字母的方法
2016/12/01 PHP
详解PHP中的 input属性(隐藏 只读 限制)
2017/08/14 PHP
php实现图片压缩处理
2020/09/09 PHP
jQuery 动态酷效果实现总结
2009/12/27 Javascript
jQuery的Ajax时无响应数据的解决方法
2010/05/25 Javascript
JavaScript常用对象的方法和属性小结
2012/01/24 Javascript
JQuery表格内容过滤的实现方法
2013/07/05 Javascript
js setTimeout opener的用法示例详解
2013/10/23 Javascript
简单的两种Extjs formpanel加载数据的方式
2013/11/09 Javascript
利用jq让你的div居中的好方法分享
2013/11/21 Javascript
jquery实现textarea 高度自适应
2015/03/11 Javascript
JavaScript的RequireJS库入门指南
2015/07/01 Javascript
javascript中setInterval的用法
2015/07/19 Javascript
详解javascript函数的参数
2015/11/10 Javascript
jQuery页面弹出框实现文件上传
2017/02/09 Javascript
JavaScript实现兼容IE6的收起折叠与展开效果实例
2017/09/20 Javascript
Vue2.0学习之详解Vue 组件及父子组件通信
2017/12/12 Javascript
微信小程序后台持续定位功能使用详解
2019/08/23 Javascript
如何通过shell脚本自动生成vue文件详解
2019/09/10 Javascript
Vuex modules模式下mapState/mapMutations的操作实例
2019/10/17 Javascript
python自动安装pip
2014/04/24 Python
Python自动化构建工具scons使用入门笔记
2015/03/10 Python
Python使用os模块和fileinput模块来操作文件目录
2016/01/19 Python
python PIL模块与随机生成中文验证码
2016/02/27 Python
CentOS中升级Python版本的方法详解
2017/07/10 Python
Python 字符串操作(string替换、删除、截取、复制、连接、比较、查找、包含、大小写转换、分割等)
2018/03/19 Python
Python实现的求解最小公倍数算法示例
2018/05/03 Python
详解如何在cmd命令窗口中搭建简单的python开发环境
2019/08/29 Python
新西兰最大、占有率最高的综合性药房:PharmacyDirect药房中文网
2020/11/03 全球购物
销售文员的岗位职责
2013/11/20 职场文书
恐龙的灭绝教学反思
2014/02/12 职场文书
销售内勤岗位职责范本
2015/04/13 职场文书
教你一步步实现一个简易promise
2021/11/02 Javascript