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 相关文章推荐
动态为事件添加js代码示例
Feb 15 Javascript
改进版通过Json对象实现深复制的方法
Oct 24 Javascript
JS操作select下拉框动态变动(创建/删除/获取)
Jun 02 Javascript
使用jQuery操作HTML的table表格的实例解析
Mar 13 Javascript
基于javascript实现按圆形排列DIV元素(三)
Dec 02 Javascript
使用JavaScript判断用户输入的是否为正整数(两种方法)
Feb 05 Javascript
javascript 缓冲运动框架的实现
Sep 29 Javascript
基于vue实现分页效果
Nov 06 Javascript
用jquery获取select标签中选中的option值及文本的示例
Jan 25 jQuery
jQuery插件jsonview展示json数据
May 26 jQuery
vue实现未登录跳转到登录页面的方法
Jul 17 Javascript
Vue中component标签解决项目组件化操作
Sep 04 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
Win2003服务器安全加固设置--进一步提高服务器安全性
2007/05/23 PHP
Yii2.0高级框架数据库增删改查的一些操作
2015/11/16 PHP
PHP  Yii清理缓存的实现方法
2016/11/10 PHP
Laravel框架中VerifyCsrfToken报错问题的解决
2017/08/30 PHP
PHP回调函数简单用法示例
2019/05/08 PHP
Smarty模板类内部原理实例分析
2019/07/03 PHP
非常不错的一个javascript 类
2006/11/07 Javascript
EasyUI 中 MenuButton 的使用方法
2012/07/14 Javascript
用js实现trim()的解决办法
2013/04/16 Javascript
Js点击弹出下拉菜单效果实例
2013/08/12 Javascript
IE、FF浏览器下修改标签透明度
2014/01/28 Javascript
JS显示表格内指定行html代码的方法
2015/03/31 Javascript
JS变量及其作用域
2017/03/29 Javascript
vue+swiper实现组件化开发的实例代码
2017/10/26 Javascript
微信小程序日历效果
2018/12/29 Javascript
详解Nuxt.js中使用Element-UI填坑
2019/09/06 Javascript
javascript网页随机点名实现过程解析
2019/10/15 Javascript
es6函数之尾递归用法实例分析
2020/04/25 Javascript
关于AngularJS中几种Providers的区别总结
2020/05/17 Javascript
[00:50]深扒TI7聊天轮盘语音出处6
2017/05/11 DOTA
[00:12]DAC SOLO赛卫冕冠军 VG.Paparazi灬展现SOLO技巧
2018/04/06 DOTA
Odoo中如何生成唯一不重复的序列号详解
2018/02/10 Python
pyspark 读取csv文件创建DataFrame的两种方法
2018/06/07 Python
Django发送邮件和itsdangerous模块的配合使用解析
2019/08/10 Python
python中删除某个元素的方法解析
2019/11/05 Python
详解Python中@staticmethod和@classmethod区别及使用示例代码
2020/12/14 Python
Jupyter Notebook 安装配置与使用详解
2021/01/06 Python
Radley英国官网:英国莱德利小狗包
2019/03/21 全球购物
Unix里面如何在后台运行程序
2016/10/14 面试题
办公室前台岗位职责范本
2013/12/10 职场文书
如何写你的创业计划书
2014/01/07 职场文书
初中考试作弊检讨书
2014/02/01 职场文书
殡葬服务心得体会
2014/09/11 职场文书
计生办班子群众路线教育实践活动个人对照检查材料思想汇报
2014/10/04 职场文书
未来,这5大方向都很适合创业
2019/07/22 职场文书
Vue CLI中模式与环境变量的深入详解
2021/05/30 Vue.js