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 无提示关闭窗口脚本
Aug 17 Javascript
jQuery的控件及事件(输入控件及回车事件)使用示例
Jul 25 Javascript
js跨域请求数据的3种常用的方法
Dec 01 Javascript
jQuery Validate插件实现表单强大的验证功能
Dec 18 Javascript
JS获取中文拼音首字母并通过拼音首字母快速查找页面内对应中文内容的方法【附demo源码】
Aug 19 Javascript
Bootstrap Table的使用总结
Oct 08 Javascript
bootstrap监听滚动实现头部跟随滚动
Nov 08 Javascript
Bootstrap 3 按钮标签实例代码
Feb 21 Javascript
vue和webpack安装命令详解
Jun 15 Javascript
vue awesome swiper异步加载数据出现的bug问题
Jul 03 Javascript
详解vue使用vue-layer-mobile组件实现toast,loading效果
Aug 31 Javascript
使用webpack和rollup打包组件库的方法
Feb 25 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
图象函数中的中文显示
2006/10/09 PHP
PHP Ajax中文乱码问题解决方法
2009/02/27 PHP
《PHP编程最快明白》第四讲:日期、表单接收、session、cookie
2010/11/01 PHP
PHPStorm+XDebug进行调试图文教程
2016/06/13 PHP
为Yahoo! UI Extensions Grid增加内置的可编辑器
2007/03/10 Javascript
javascript 极速 隐藏/显示万行表格列只需 60毫秒
2009/03/28 Javascript
JQuery结合CSS操作打印样式的方法
2013/12/24 Javascript
js(JavaScript)实现TAB标签切换效果的简单实例
2014/02/26 Javascript
JS实现距离上次刷新已过多少秒示例
2014/05/23 Javascript
avascript中的自执行匿名函数应用示例
2014/09/15 Javascript
jQuery使用CSS()方法给指定元素同时设置多个样式
2015/03/26 Javascript
JavaScript中使用concat()方法拼接字符串的教程
2015/06/06 Javascript
实例讲解jQuery EasyUI tree中state属性慎用
2016/04/01 Javascript
浅析JS中对函数function的理解(基础篇)
2016/10/14 Javascript
Vue 单文件中的数据传递示例
2017/03/21 Javascript
解决layui的使用以及针对select、radio等表单组件不显示的问题
2019/09/05 Javascript
vue 实现 rem 布局或vw 布局的方法
2019/11/13 Javascript
利用JavaScript为句子加标题的3种方法示例
2021/01/05 Javascript
收集的几个Python小技巧分享
2014/11/22 Python
详解Python验证码识别
2016/01/25 Python
Python实现判断并移除列表指定位置元素的方法
2018/04/13 Python
Python 解码Base64 得到码流格式文本实例
2020/01/09 Python
解决Python Matplotlib绘图数据点位置错乱问题
2020/05/16 Python
Python 如何操作 SQLite 数据库
2020/08/17 Python
python Matplotlib数据可视化(2):详解三大容器对象与常用设置
2020/09/30 Python
python Cartopy的基础使用详解
2020/11/01 Python
HTML5实现移动端点击翻牌功能
2020/10/23 HTML / CSS
意大利高端时尚买手店:Stefania Mode
2018/03/01 全球购物
英国性能汽车零件和发动机配件在线:Maxpeedingrods
2019/11/05 全球购物
Habitat家居英国官方网站:沙发、家具、照明、厨房和户外
2019/12/12 全球购物
优质飞蝇钓和渔具:RiverBum
2020/05/10 全球购物
学院领导推荐信
2013/10/30 职场文书
司马光教学反思
2014/02/01 职场文书
五一劳动节活动记录
2014/03/23 职场文书
2015年试用期自我评价范文
2015/03/10 职场文书
辩护意见书
2015/06/04 职场文书