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的一些总结
Nov 03 Javascript
javascript 面向对象,实现namespace,class,继承,重载
Oct 29 Javascript
键盘 keycode的值 javascript时触发事件时很有用的要素
Nov 02 Javascript
jQuery控制输入框只能输入数值的小例子
Mar 20 Javascript
node.js中的console.error方法使用说明
Dec 10 Javascript
JS获取鼠标选中的文字
Aug 10 Javascript
javascript基础进阶_深入剖析执行环境及作用域链
Sep 05 Javascript
微信小程序之GET请求的实例详解
Sep 29 Javascript
vue-resource拦截器设置头信息的实例
Oct 27 Javascript
详解node.js的http模块实例演示
Jul 12 Javascript
微信小程序实现富文本图片宽度自适应的方法
Jan 20 Javascript
微信小程序单选框自定义赋值
May 26 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&amp;java(二)
2006/10/09 PHP
PHP用mysql数据库存储session的代码
2010/03/05 PHP
PHP函数spl_autoload_register()用法和__autoload()介绍
2012/02/04 PHP
php对二维数组进行相关操作(排序、转换、去空白等)
2015/11/04 PHP
分享27个jQuery 表单插件集合推荐
2011/04/25 Javascript
顶部缓冲下拉菜单导航特效的JS代码
2013/08/27 Javascript
jQuery中:nth-child选择器用法实例
2014/12/31 Javascript
详解JavaScript对W3C DOM模版的支持情况
2015/06/16 Javascript
基于Jquery+div+css实现弹出登录窗口(代码超简单)
2015/10/27 Javascript
JS日期对象简单操作(获取当前年份、星期、时间)
2016/10/26 Javascript
jQuery自定义多选下拉框效果
2017/06/19 jQuery
JS实现问卷星自动填问卷脚本并在两秒自动提交功能
2020/06/17 Javascript
javascript 判断用户有没有操作页面
2017/10/17 Javascript
jquery实现左右轮播切换效果
2018/01/01 jQuery
vue.js实现的经典计算器/科学计算器功能示例
2018/07/11 Javascript
详解小程序云开发数据库
2019/05/20 Javascript
Node.js API详解之 module模块用法实例分析
2020/05/13 Javascript
[49:29]LGD vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
在Django中限制已登录用户的访问的方法
2015/07/23 Python
Python中如何获取类属性的列表
2016/12/26 Python
Python 和 JS 有哪些相同之处
2017/11/23 Python
Python中is和==的区别详解
2018/11/15 Python
浅谈Django中view对数据库的调用方法
2019/07/18 Python
Python中生成一个指定长度的随机字符串实现示例
2019/11/06 Python
关于Pytorch的MLP模块实现方式
2020/01/07 Python
Python使用configparser读取ini配置文件
2020/05/25 Python
Python中bisect的用法及示例详解
2020/07/20 Python
python爬虫请求头设置代码
2020/07/28 Python
欧尚俄罗斯网上超市:Auchan俄罗斯
2018/05/03 全球购物
巴基斯坦购物网站:Goto
2019/03/11 全球购物
TCP/IP的分层模型
2013/10/27 面试题
Linux如何为某个操作添加别名
2013/03/01 面试题
餐饮主管岗位职责
2013/12/10 职场文书
网络程序员自荐信
2014/01/25 职场文书
党的群众路线教育实践活动对照检查材料(个人)
2014/09/24 职场文书
CentOS MySql8 远程连接实战
2022/04/19 MySQL