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 相关文章推荐
为你的网站增加亮点的9款jQuery插件推荐
May 03 Javascript
IE网页js语法错误2行字符1、FF中正常的解决方法
Sep 09 Javascript
jquery实现滑动图片自己测试的例子
Nov 05 Javascript
Jquery中ajax方法data参数的用法小结
Feb 12 Javascript
javascript面向对象之this关键词用法分析
Jan 13 Javascript
GitHub上一些实用的JavaScript的文件压缩解压缩库推荐
Mar 13 Javascript
关于JS中match() 和 exec() 返回值和属性的测试
Mar 21 Javascript
jQuery基于toggle实现click触发DIV的显示与隐藏问题分析
Jun 12 Javascript
在vue 中使用 less的教程详解
Sep 26 Javascript
JS基于Location实现访问Url、重定向及刷新页面的方法分析
Dec 03 Javascript
vue实现分页组件
Jun 16 Javascript
JS中如何轻松遍历对象属性的方式总结
Aug 06 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 删除一个目录及目录下的所有文件的函数代码
2010/05/26 PHP
浅谈php函数serialize()与unserialize()的使用方法
2014/08/19 PHP
Laravel下生成验证码的类
2017/11/15 PHP
tp5框架基于Ajax实现列表无刷新排序功能示例
2020/02/10 PHP
jQuery使用手册之二 DOM操作
2007/03/24 Javascript
jQuery EasyUI API 中文文档 - ProgressBar 进度条
2011/09/29 Javascript
解析JavaScript中的标签语句
2013/06/19 Javascript
js/html光标定位的实现代码
2013/09/23 Javascript
常用的几段javascript代码分享
2014/03/25 Javascript
jQuery事件用法实例汇总
2014/08/29 Javascript
JavaScript中eval函数的问题
2016/01/31 Javascript
JavaScript学习笔记--常用的互动方法
2016/12/07 Javascript
Vue单文件组件基础模板小结
2017/08/10 Javascript
layui中layer前端组件实现图片显示功能的方法分析
2017/10/13 Javascript
微信小程序之批量上传并压缩图片的实例代码
2018/07/05 Javascript
微信小程序实现多选框全选与取消全选功能示例
2019/05/14 Javascript
js图片无缝滚动插件使用详解
2020/05/26 Javascript
vue微信分享插件使用方法详解
2020/02/18 Javascript
js实现批量删除功能
2020/08/27 Javascript
从零开始用webpack构建一个vue3.0项目工程的实现
2020/09/24 Javascript
[05:31]干嘛呢兄弟!DOTA2 TI9语音轮盘部分出处
2019/05/14 DOTA
python并发编程之多进程、多线程、异步和协程详解
2016/10/28 Python
python下解压缩zip文件并删除文件的实例
2018/04/24 Python
Python实现的列表排序、反转操作示例
2019/03/13 Python
Python3.5面向对象与继承图文实例详解
2019/04/24 Python
Python实现RGB与HSI颜色空间的互换方式
2019/11/27 Python
Python selenium 自动化脚本打包成一个exe文件(推荐)
2020/01/14 Python
彻底搞懂python 迭代器和生成器
2020/09/07 Python
Python实现迪杰斯特拉算法过程解析
2020/09/18 Python
中医药大学市场营销专业自荐信
2013/09/29 职场文书
机械系大学毕业生推荐信
2013/11/27 职场文书
文艺晚会主持词
2014/03/24 职场文书
幼儿园母亲节活动总结
2015/02/10 职场文书
2015年学校总务处工作总结
2015/05/19 职场文书
三八红旗手先进事迹材料(2016推荐版)
2016/02/25 职场文书
Python查找算法的实现 (线性、二分,分块、插值查找算法)
2022/04/24 Python