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 相关文章推荐
jQuery实战之品牌展示列表效果
Apr 10 Javascript
jQuery层次选择器选择元素使用介绍
Apr 18 Javascript
用js设置下拉框为只读的小技巧
Apr 10 Javascript
PHP 数组current和next用法分享
Mar 05 Javascript
Vue 2.0的数据依赖实现原理代码简析
Jul 10 Javascript
详解基于Angular4+ server render(服务端渲染)开发教程
Aug 28 Javascript
详解angularjs popup-table 弹出框表格指令
Sep 20 Javascript
vue-router 路由基础的详解
Oct 17 Javascript
解决vue中无法动态修改jqgrid组件 url地址的问题
Mar 01 Javascript
jQuery实现基本动画效果的方法详解
Sep 06 jQuery
微信小程序地图导航功能实现完整源代码附效果图(推荐)
Apr 28 Javascript
Vue 实现html中根据类型显示内容
Oct 28 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
zf框架的db类select查询器join链表使用示例(zend框架)
2014/03/14 PHP
深入理解PHP内核(二)之SAPI探究
2015/11/10 PHP
JsEasy简介 JsEasy是什么?与下载
2007/03/07 Javascript
jquery动态添加删除div 具体实现
2013/07/20 Javascript
cookie的复制与使用记住用户名实现代码
2013/11/04 Javascript
自己动手实现jQuery Callbacks完整功能代码详解
2013/11/25 Javascript
iframe里面的元素触发父窗口元素事件的jquery代码
2014/10/19 Javascript
node.js中的fs.writeSync方法使用说明
2014/12/15 Javascript
PageSwitch插件实现100种不同图片切换效果
2015/07/28 Javascript
轻松学习Javascript闭包函数
2015/12/15 Javascript
js实现功能比较全面的全选和多选
2017/03/02 Javascript
elemetUi 组件--el-upload实现上传Excel文件的实例
2017/10/27 Javascript
vue 项目如何引入微信sdk接口的方法
2017/12/18 Javascript
JavaScript判断变量名是否存在数组中的实例
2017/12/28 Javascript
浅谈webpack-dev-server的配置和使用
2018/05/17 Javascript
layDate插件设置开始和结束时间
2018/11/15 Javascript
如何能分清npm cnpm npx nvm
2019/01/17 Javascript
vue自定义switch开关组件,实现样式可自行更改
2019/11/01 Javascript
VUE 解决mode为history页面为空白的问题
2019/11/01 Javascript
jQuery实现日历效果
2020/09/11 jQuery
详解Vue中的自定义指令
2020/12/07 Vue.js
微信小程序实现可拖动悬浮图标(包括按钮角标的实现)
2020/12/29 Javascript
python中的__slots__使用示例
2015/02/26 Python
Python中用Spark模块的使用教程
2015/04/13 Python
Python使用matplotlib填充图形指定区域代码示例
2018/01/16 Python
TensorFlow平台下Python实现神经网络
2018/03/10 Python
Django数据结果集序列化并展示实现过程
2020/04/22 Python
在C中是否有模拟继承等面向对象程序设计特性的好方法
2012/05/22 面试题
EJB的激活机制
2013/10/25 面试题
XMLHttpRequest对象在IE和Firefox中创建方式有没有不同
2016/03/23 面试题
演讲比赛获奖感言
2014/02/02 职场文书
市场营销专业应届生自荐信
2014/06/19 职场文书
2014年“四风”问题个人整改措施
2014/09/17 职场文书
返乡农民工证明
2015/06/24 职场文书
Mongodb 迁移数据块的流程介绍分析
2022/04/18 MongoDB
Java实现带图形界面的聊天程序
2022/06/10 Java/Android