介绍

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. Ajax的get、post和ajax提交

    JQuery.get(url,[data],[callback],[type]) []里面的参数是可选的,不是必填的. [data]:带发送的key/value数据. [callback]:载入成功时 ...

  2. 2016.3.14__CSS 定位__第六天

    假设您认为这篇文章还不错.能够去H5专题介绍中查看很多其它相关文章. CSS 定位机制 CSS中一共同拥有三种基本定位机制:普通流.浮动.绝对定位. 假设不进行专门指定.全部的标签都在普通流中定位. ...

  3. android studio 2.2 使用cmake编译NDK

    Android studio 2.2 已经进入beta版本,新功能添加众多,NDK编程也得到了简化.官方博客介绍.本文介绍如何使用新版android studio调用 c++代码,为了超级通俗易懂,例 ...

  4. js中的对象与数组

    js对象与数组是js中最基本的概念, 定义对象时可用 var a = {} 定义一个空对象 定义数组时可用 var a = [] 定义一个空字符串.. 在对象中只是存在属性,属性与值之间用" ...

  5. 将jar安装到本地mvn仓库

    声明:仅限于将maven Repository下载的jar(使用maven打包的jar)安装到本地的maven仓库中,不保证全部成功,最初的时候添加依赖发现下载始终不成功,只能手动下载,但是手动下载完 ...

  6. 【t014】拯数

    [题目链接]:http://noi.qz5z.com/viewtask.asp?id=t014 [题意] [题解] 这个锁的序列,如果把末尾的0去掉; 然后再倒过来; 那么就是这个序列对应的格雷码了; ...

  7. MyEclipse各种版本号注冊码

    一:MyEclipse_6.0.1GA_E3.3.1_FullStackInstaller注冊码 Subscriber:javp Subscription Code:wLR7ZL-655551-685 ...

  8. python 读写XLS

    需要库: xlrd, xlwt, xlutils 导入 import xlrd from xlutils.copy import copy 打开文件 data = xlrd.open_workbook ...

  9. STL序列式容器之list

    一,list容器基本概念 1.list容器基本知识 list容器的底部数据结构为双向链表,可以高效的进行插入和删除元素. list因为底层数据结构是双向链表,因此不支持下标操作和.at()函数的操作. ...

  10. WPF 3D中多个模型如何设置某一个在最前？

    原文:WPF 3D中多个模型如何设置某一个在最前? 问题:我们的模型包括导入的3D solid模型和axis坐标轴模型,当模型旋转的时候,3D会将axis挡住. 期望:axis一直在最前面,不会被3D ...