有时候我们需要动态的加入适合的js,因为有时候不需要将所有的js都加载进来,以来提高效率,但这种方法比较适合单个js文件比较大的情况

如果js文件都比较小,还是一个js好,这样可以减少连接数。下面是4种比较常用的方法,大家可以根据情况选择,最后脚本之家 将会给推荐一个。

1、直接document.write 

<script language="javascript">
document.write("<script src='test.js'><\/script>");
</script>

2、动态改变已有script的src属性

<script src='' id="s1"></script>
<script language="javascript">
s1.src="test.js"
</script>

3、动态创建script元素

<script>
  var oHead = document.getElementsByTagName('HEAD').item(0);
  var oScript= document.createElement("script");
  oScript.type = "text/javascript";
  oScript.src="test.js";
  oHead.appendChild( oScript);
</script>

JS 动态加载脚本的4种方法的更多相关文章

  1. js 动态加载事件的几种方法总结

    本篇文章主要是对js 动态加载事件的几种方法进行了详细的总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助   有些时候需要动态加载javascript事件的一些方法往往我们需要在 JS 中动态添 ...

  2. JS 动态加载脚本 执行回调

    JS 动态加载脚本  执行回调 关于在javascript里面加载其它的js文件的问题可能很多人都遇到过,但很多朋友可能并不知道怎么判断我们要加载的js文件是否加载完成,如果没有加载完成我们就调用文件 ...

  3. js动态加载脚本

    最近公司的前端地图产品需要做一下模块划分,希望用户用到哪一块的功能再加载哪一块的模块,这样可以提高用户体验. 所以到处查资料研究js动态脚本的加载,不过真让人伤心啊!,网上几乎都是同一篇文章,4种方法 ...

  4. JS 动态加载脚本 执行回调_转

    关于在javascript里面加载其它的js文件的问题可能很多人都遇到过,但很多朋友可能并不知道怎么判断我们要加载的js文件是否加载完成,如果没有加载完成我们就调用文件里面的函数是不会成功的.本文讲解 ...

  5. js实现动态加载脚本的方法实例汇总

      本文实例讲述了js实现动态加载脚本的方法.分享给大家供大家参考,具体如下: 最近公司的前端地图产品需要做一下模块划分,希望用户用到哪一块的功能再加载哪一块的模块,这样可以提高用户体验. 所以到处查 ...

  6. js实用方法记录-js动态加载css、js脚本文件

    js实用方法记录-动态加载css/js 附送一个加载iframe,h5打开app代码 1. 动态加载js文件到head标签并执行回调 方法调用:dynamicLoadJs('http://www.yi ...

  7. js与jquery的动态加载脚本文件

    jquery动态加载 jQuery.getScript(url,[callback]) js动态加载 function loadJs(name) { document.write('<scrip ...

  8. 第一百一十八节,JavaScript,动态加载脚本和样式

    JavaScript,动态加载脚本和样式 一动态脚本 当网站需求变大,脚本的需求也逐步变大.我们就不得不引入太多的JS脚本而降低了整站的性能,所以就出现了动态脚本的概念,在适时的时候加载相应的脚本. ...

  9. JavaScript的DOM_动态加载脚本和样式

    一.动态加载脚本 当网站需求变大,脚本的需求也逐步变大.我们就不得不引入太多的 JS 脚本而降低了整站的性能,所以就出现了动态脚本的概念,在适时的时候加载相应的脚本. 1.动态加载js文件 比如:我们 ...

随机推荐

  1. NHibernate many-to-one映射

    many-to-one 数据方面,多条对一条. 非主键字段与主键字段的关联,在类中实现了一对一的单向映射.在类中是单实体映射. 订单充值业务.显然,一单位可以有多个充值信息. 通过表 Deposit里 ...

  2. 修改select样式

    CSS就可以解决,原理是将浏览器默认的下拉框样式清除,然后应用上自己的,再附一张向右对齐小箭头的图片即可. select { /*Chrome和Firefox里面的边框是不一样的,所以复写了一下*/ ...

  3. transition的用法以及animation的用法

    http://www.cnblogs.com/xiaohuochai/p/5347930.html transiton: 过渡属性 过渡所需要时间 过渡动画函数 过渡延迟时间: 触发过渡 单纯的代码不 ...

  4. 第十三次CCF第四题 1803——04 博弈

    我又写了一个简洁版的2.0: 可以作为博弈搜索树的模板  : https://www.cnblogs.com/xidian-mao/p/9389974.html 废话ps: 开始觉得这是一道简单得博弈 ...

  5. spring IOC简单分析

    Spring IOC 体系结构 BeanFactory(BeanFactory 里只对 IOC 容器的基本行为作了定义,根本不关心你的 bean 是如何定义怎样加载的.正如我们只关心工厂里得到什么的产 ...

  6. (19)jQuery操作文本和属性

    <!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>jq ...

  7. mysql将某数据库的全部权限赋给某用户,提示1044错误Access denied

    mysql> grant all privileges on zabbix.* to zabbix@localhost identified by 'zabbix'; ERROR 1044 (4 ...

  8. 实现在同一界面打开putty终端连接工具

    用过putty的人可能知道,每打开一次啊putty程序只能开启一个连接,这个在实际运用中很不方便,反正我开ssh一般都是同时开四个窗口 其实有一个程序可以实现打开多个putty,下面是下载地址 htt ...

  9. MySQL--派生表临时结果集中的AutoKey

    在某些场景中,需要对派生表生成临时结果集进行materialized,如果该临时结果集中包含索引键,那么查询有可能通过该索引键来进行优化. 如对下面查询: SELECT T2.purpose_code ...

  10. nginx ssi + ngx_pagespeed 实现micro frontends 开发

    nginx 的ssi 功能让我们可以将不同的拼接起来,ngx_pagespeed 是pagespeed 的nginx 模块,可以帮助 我们解决前端的一些性能优化的问题,通过简单的配置就可以搞定 一张参 ...