介绍

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. 曼德勃罗（Mandelbrot）集合与其编程实现

    一.从科赫雪花谈起 设想一个边长为1的等边三角形(例如以下图所看到的).取每边中间的三分之中的一个,接上去一个形状全然类似的但边长为其三分之中的一个的三角形,结果是一个六角形.如今取六角形的每个边做相 ...

  2. 使用搜狐Sendcloud的Webapi发送邮件：Jodd和Apache Httpclient

    最近,在使用搜狐Sendcloud发邮件.    Sendcloud提供http格式的webapi,方便地发送邮件,当然是要付费的. 很早之前,http工具一直用Httpclient,后来觉得jodd ...

  3. STS开发环境搭建与配置

    STS开发环境搭建与配置 (2012-04-11 07:24:51) 转载▼ 1.   环境准备 安装JDK.MAVEN 1.1.        下载 下载sprdfingsource-tool-su ...

  4. 怎样在log4j.xml配置文件中引入变量：小公司经验较多的我和阿里UC等大公司经验较多的Boss，一些技术交流和探讨

    从最初学习使用log4j的时候,网上和书本上主要都是使用"log4j.properties"这种属性格式,配置日志.多年以来,一直使用这种格式,总的来说,简单.够用.    而有十 ...

  5. 【a901】滑雪

    Time Limit: 10 second Memory Limit: 2 MB 问题描述 滑雪是一项非常刺激的运动,为了获得速度,滑雪的区域必须向下倾斜,而且当你滑到坡底,你不得不再次走上坡或者等待 ...

  6. 【t012】整理书架

    Time Limit: 1 second Memory Limit: 32 MB [问题描述] 小明是一个非常喜欢读书的孩子,他有一个特别的书架,书架上摆放着他买的新书.当他决定要阅读某本图书时,他就 ...

  7. Spring中WebApplicationInitializer的理解

    现在JavaConfig配置方式在逐步取代xml配置方式.而WebApplicationInitializer可以看做是Web.xml的替代,它是一个接口.通过实现WebApplicationInit ...

  8. selenium + firefox登录空间

    在网上看到的大部分都是Python版本的,于是写了个java版本的 环境: selenium-java 3.9.1 firefox 57.0 geckodriver 0.19.1 firefox与ge ...

  9. iOS开发 － OC － block的详解 - 深入篇

    深入理解oc中的block 苹果在Mac OS X10.6 和iOS 4之后引入了block语法.这一举动对于许多OC使用者的编码风格改变很大.就我本人而言,感觉block用起来还是很爽的,但一直以来 ...

  10. Net锁

    Net分布式锁的实现 序言 我晚上有在公司多呆会儿的习惯,所以很多晚上我都是最后一个离开公司的.当然也有一些同事,跟我一样喜欢在公司多搞会儿.这篇文章就要从,去年年末一个多搞会的晚上说起,那是一个夜黑 ...