这种引入很看到很想死吧!

<script src="1.js"></script>
<script src="2.js"></script>
<script src="3.js"></script>
<script src="4.js"></script>
<script src="5.js"></script>
<script src="6.js"></script>

require.js可以很好的优化这个问题:

1、下载require.js http://requirejs.org/docs/download.html

2、用法

如果放底部

<script src="js/require.js"></script>

如果放头部

<script src="js/require.js" defer async="true" ></script>

指定主程序为main.js

<script src="js/require.js" data-main="js/main"></script>

3、主模块写法

// main.js
  require(['moduleA', 'moduleB', 'moduleC'], function (moduleA, moduleB, moduleC){
    // some code here
});

原来的:

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<title>html</title> </head>
<body> <script type="text/javascript" src="js/m1.js"></script>
<script type="text/javascript" src="js/m2.js"></script>
<script type="text/javascript" src="js/m3.js"></script>
<script type="text/javascript" src="js/m4.js"></script>
</body>
</html>

就可以改为:

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<title>html</title> </head>
<body> <script src="js/require.js" data-main="js/main"></script>
</body>
</html>
//main.js
require(['m1','m2','m3','m4'],function(m1,m2,m3,m4){ });

利用require.js实现javascript模块化加载的更多相关文章

  1. 该如何理解AMD ,CMD,CommonJS规范--javascript模块化加载学习总结

    是一篇关于javascript模块化AMD,CMD,CommonJS的学习总结,作为记录也给同样对三种方式有疑问的童鞋们,有不对或者偏差之处,望各位大神指出,不胜感激. 本篇默认读者大概知道requi ...

  2. 实现一个JavaScript模块化加载器

    对任何程序,都存在一个规模的问题,起初我们使用函数来组织不同的模块,但是随着应用规模的不断变大,简单的重构函数并不能顺利的解决问题.尤其对JavaScript程序而言,模块化有助于解决我们在前端开发中 ...

  3. JavaScript 模块化加载

    存在AMD(Asynchronous Module Definition异步模块定义)规范和CMD(Common Module Definition通用模块定义)规范.对于依赖的模块,AMD是提前执行 ...

  4. webpack中利用require.ensure()实现按需加载

    webpack中的require.ensure()可以实现按需加载资源包括js,css等,它会给里面require的文件单独打包,不和主文件打包在一起,webpack会自动配置名字,如0.js,1.j ...

  5. 应用require.js进行javascript模块化编程小试一例

    长久以来都渴望应用javascript的模块化编程.今日紧迫更甚,岁月蹉跎,已经不能再等了. 拜读阮一峰的有关文章已经好几遍,文章写得真好,简洁流畅,头头是道,自觉有点明白了.但经验告诉我们,一定要亲 ...

  6. 再唠叨JS模块化加载之CommonJS、AMD、CMD、ES6

    Javascript模块化编程,已经成为一个迫切的需求.理想情况下,开发者只需要实现核心的业务逻辑,其他都可以加载别人已经写好的模块. Javascript社区做了很多努力,在现有的运行环境中,实现” ...

  7. require.js模块化管理和加载js(按需加载)简单实例教学

    一.为什么要用require.js? 最早的时候,所有Javascript代码都写在一个文件里面,只要加载这一个文件就够了.后来,代码越来越多,一个文件不够了,必须分成多个文件,依次加载.下面的网页代 ...

  8. js模块化加载器实现

    背景 自es6以前,JavaScript是天生模块化缺失的,即缺少类似后端语言的class, 作用域也只以函数作为区分.这与早期js的语言定位有关, 作为一个只需要在网页中嵌入几十上百行代码来实现一些 ...

  9. 【 js 模块加载 】深入学习模块化加载(node.js 模块源码)

    一.模块规范 说到模块化加载,就不得先说一说模块规范.模块规范是用来约束每个模块,让其必须按照一定的格式编写.AMD,CMD,CommonJS 是目前最常用的三种模块化书写规范.  1.AMD(Asy ...

随机推荐

  1. 2015多校第7场 HDU 5378 Leader in Tree Land 概率DP

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5378 题意:一棵n个节点的树.对其节点进行标号(1~n).求恰好存在k个节点的标号是其节点所在子树的最 ...

  2. Leetcode 之Add Binary(29)

    比较简单,细节:先将字符串翻转,注意进位. string addBinary(string a, string b) { string result; int len = a.size() > ...

  3. MySQL关键字大全

    转载自:https://blog.csdn.net/benxiaohai888/article/details/77803090 在使用MySQL的时候,一般尽量避免用关键字作为表名,如使用关键字做表 ...

  4. 机器学习方法(七):Kmeans聚类K值如何选,以及数据重抽样方法Bootstrapping

    欢迎转载,转载请注明:本文出自Bin的专栏blog.csdn.net/xbinworld. 技术交流QQ群:433250724,欢迎对算法.技术感兴趣的同学加入.我的博客写一些自己用得到东西,并分享给 ...

  5. Search Insert Position——二分法

    Given a sorted array and a target value, return the index if the target is found. If not, return the ...

  6. bzoj1597 斜率优化dp

    思路:先把没有用的土地去掉,然后按照x轴排序,容易得到dp转移方程 dp[ i ] = min{ dp[ j ] + b[ j + 1 ] * a[ i ] }    0 <= j < i ...

  7. 2017-2018 ACM-ICPC Northern Eurasia (Northeastern European Regional) Contest (NEERC 17) 日常训练

    A - Archery Tournament 题目大意:按时间顺序出现靶子和射击一个位置,靶子的圆心为(x, y)半径为r,即圆与x轴相切,靶子不会重叠,靶子被击中后消失, 每次射击找出哪个靶子被射中 ...

  8. Linux rsync数据定时增量备份

    一.安装rsync服务端 1.查看是否安装rsync ps -ef | grep rsync 系统一般默认已安装,安装方法: yum -y install rsync 2.添加配置文件 rsync没有 ...

  9. socket编程的网络协议

    "我们在传输数据时,可以只使用(传输层)TCP/IP协议,但是那样的话,如果没有应用层,便无法识别数据内容" TCP/IP只是一个协议栈,就像程序运行一样,必须要实现运行,同时还要 ...

  10. 【剑指offer】面试题 5. 替换空格

    面试题 5. 替换空格 题目:请实现一个函数,将一个字符串中的空格替换成"%20".例如,当字符串为We Are Happy. 则经过替换之后的字符串为We%20Are%20Hap ...