介绍

RequireJS是一个非常小巧的JavaScript模块载入框架，是AMD规范最好的实现者之一。最新版本的RequireJS压缩后只有14K，堪称非常轻量。它还同时可以和其他的框架协同工作，使用RequireJS必将使您的前端代码质量得以提升。

特点

  1. 模块化加载
  2. 防止js加载阻塞页面渲染
  3. 使用程序调用的方式加载js，代码更美观

基本用法

正常使用

index.html

<!DOCTYPE html>

<html>

    <head>

        <script type="text/javascript" src="app.js"></script>

    </head>

    <body>

      <span>body</span>

    </body>

</html>

app.js

function fun1(){

  alert("it works");

}

fun1();

requirejs用法

先下载requirejs代码包，然后按照下面的方法引用

index.html

<!DOCTYPE html>

<html>

    <head>

        <script type="text/javascript" src="require.js"></script>

        <script type="text/javascript">

            require(["app"]);

        </script>

    </head>

    <body>

      <span>body</span>

    </body>

</html>

app.js

define(function(){

    function fun1(){

      alert("it works");

    }

    fun1();

})

此时打开页面，发现弹出it works，说明调用成功了，然后发现这个requirejs调用还有一个好处就是，解决了js加载阻塞问题。

相关链接：

  1. requirejs菜鸟教程
  2. requirejs官网

requirejs教程（一）：基本用法的更多相关文章

  1. php中的curl使用入门教程和常见用法实例

    摘要: [目录] php中的curl使用入门教程和常见用法实例 一.curl的优势 二.curl的简单使用步骤 三.错误处理 四.获取curl请求的具体信息 五.使用curl发送post请求 六.文件 ...

  2. 【转】JS模块化工具requirejs教程(二)：基本知识

    前一篇:JS模块化工具requirejs教程(一):初识requirejs 我们以非常简单的方式引入了requirejs,这一篇将讲述一下requirejs中的一些基本知识,包括API使用方式等. 基 ...

  3. 【转】JS模块化工具requirejs教程(一)：初识requirejs

    随着网站功能逐渐丰富,网页中的js也变得越来越复杂和臃肿,原有通过script标签来导入一个个的js文件这种方式已经不能满足现在互联网开发模式,我们需要团队协作.模块复用.单元测试等等一系列复杂的需求 ...

  4. 菜鸟requireJS教程---2、基本知识

    菜鸟requireJS教程---2.基本知识 一.总结 一句话总结: 1.requireJS中的api就define(比如定义自己的函数)和require 2.requireJS使用的话就是配置req ...

  5. 菜鸟requireJS教程---1、初识requirejs

    菜鸟requireJS教程---1.初识requirejs 一.总结 一句话总结: Using a modular script loader like RequireJS will improve ...

  6. requireJS教程

    目录[-] 使用 RequireJS 优化 Web 应用前端 AMD 简介 传统 JavaScript 代码的问题 AMD 的引入 清单 1. AMD 规范 RequireJS 简介 实战 Requi ...

  7. 【requirejs】JS模块化工具requirejs教程

    初识requirejs 随着网站功能逐渐丰富,网页中的js也变得越来越复杂和臃肿,原有通过script标签来导入一个个的js文件这种方式已经不能满足现在互联网开发模式,我们需要团队协作.模块复用.单元 ...

  8. JS模块化工具requirejs教程(二)：基本知识

    基本API require会定义三个变量:define,require,requirejs,其中require === requirejs,一般使用require更简短 define 从名字就可以看出 ...

  9. JS模块化工具requirejs教程(一)：初识requirejs

    随着网站功能逐渐丰富,网页中的js也变得越来越复杂和臃肿,原有通过script标签来导入一个个的js文件这种方式已经不能满足现在互联网开发模式,我们需要团队协作.模块复用.单元测试等等一系列复杂的需求 ...

随机推荐

  1. &lt;LeetCode OJ&gt; 62. / 63. Unique Paths（I / II）

    62. Unique Paths My Submissions Question Total Accepted: 75227 Total Submissions: 214539 Difficulty: ...

  2. ahks

    !+F11:: newStr := clipboard ;newStr := RegExReplace(newStr, "<[^>]*>", "&quo ...

  3. 雷观(十):管理自己的任务列表(TodoList)很重要

    由幼年,到青年,再到成年,你会发现自己有越来越多的事情要做.参加工作后,很可能要在多个战线上同时忙碌. 最常见的有,工作(可能会加班加点).爱情(不少人忙着恋爱,需要花费很多心思).个人娱乐(玩游戏看 ...

  4. 电子商务网站的设计与实现(四)：项目名称malling和一期开发计划

    项目名称:小雷B2C商城系统代号:malling,mall商城的意思,加个ing表示正在进行.更主要的是与"morning"发音很像,非常容易记忆.morning是"早上 ...

  5. VC和matlab混合开发遇到的问题及其解决办法

    作者:朱金灿 来源:http://blog.csdn.net/clever101 1. error C2011: '_INTERFACE_INFO' : 'struct' type redefinit ...

  6. 【19.05%】【codeforces 731F】 Video Cards

    time limit per test1 second memory limit per test256 megabytes inputstandard input outputstandard ou ...

  7. Codeforces C. Pattern 412 解决问题的方法

    这个问题是比较暴力的法律主体. 主要是检查每一个是否没有使用足够的?.假设优先使用其他的无论是什么字母,假设你一定不能使用?. 找一个有能力并给予所有的字符串匹配字符串,而且采用的最小?号码. 原标题 ...

  8. 利用WPF建立自己的3d gis软件（非axhost方式）（三）矢量数据显示控制

    原文:利用WPF建立自己的3d gis软件(非axhost方式)(三)矢量数据显示控制 先下载SDK:https://pan.baidu.com/s/1M9kBS6ouUwLfrt0zV0bPew 密 ...

  9. C# 8.0 预览特性

    初试C# 8.0 Visual Studio 2019的第一个预览版(使用Visual Studio 2019提高每个开发人员的工作效率)和.NET Core 3.0(宣布.NET Core 3预览1 ...

  10. jquer表单序列化加强版

    相同name值会转化为一个数组 $.fn.serializeObject = function(){ var o = {}; var a = this.serializeArray(); $.each ...