介绍

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. jquery-1 jquery几个小实例

    jquery-1  jquery几个小实例 一.总结 一句话总结:jquery真的是简单加简便. 1.jquery中改变多个css属性怎么整? 可以链式连接方式,也可以大括号整多个.中间是键值对加引号 ...

  2. IT咨询服务-客户案例(四)：根据图片等素材，动态生成个性化图片

    最近,慕名而来一个客户. 客户的目标    网站来一个用户,选择模版,上传图片等素材,生成自定义的图片,或者静态网站,然后分享到社交网站.有点类似于,网上制作名片,选择模版,输入个人信息,生成名片的设 ...

  3. 【t101】小明搬家

    Time Limit: 1 second Memory Limit: 128 MB [问题描述] 小明要搬家了,大家都来帮忙. 小明现在住在第N楼,总共K个人要把X个大箱子搬上N楼. 最开始X个箱子都 ...

  4. .net程序客户端更新方案

    原文:.net程序客户端更新方案 客户端程序一个很大的不便的地方就是程序集更新,本文这里简单的介绍一种通用的客户端更新方案.这个方案依赖程序集的动态加载,具体方案如下: 将程序集存储在一个文件数据库中 ...

  5. 使用RpcLite构建SOA/Web服务(Full .Net Framework)

    使用RpcLite构建SOA/Web服务(Full .Net Framework) SOA框架系列 1. 使用RpcLite构建SOA/Web服务 2. 使用RpcLite构建SOA/Web服务(Fu ...

  6. 一起学Python：正则表达式概述

    re模块操作 在Python中需要通过正则表达式对字符串进行匹配的时候,可以使用一个模块,名字为re 1. re模块的使用过程 #coding=utf-8 # 导入re模块 import re # 使 ...

  7. 经典卷积神经网络的学习（二）—— VGGNet

    1. 简介 VGGNet 是牛津大学计算机视觉组(Visual Geometry Group)和 Google DeepMind 公司的研究员一起研发的深度卷积神经网络,其主要探索了卷积神经网络的深度 ...

  8. [Android]使用ViewPager实现图片滑动展示

    在淘宝等电商的APP首页经常能看到大幅的广告位,通常有多幅经常更新的图片用于展示促销信息,如下图所示: 通常会自动滚动,也可以根据手势滑动.我没有研究过人家的APP是通过什么实现的,可能有第三方已经封 ...

  9. TableLayout表格布局

    1.本节学习路线图 路线图分析: 从上面的路线图,可以看出TableLayout的用法还是很简单的,无非就是确定表格的行数,以及使用 那三个属性来设置每一行中的第某列的元素隐藏,拉伸,或者收缩即可! ...

  10. tinkerpop（1） 地图数据库console科研

    原创文章连接: http://blog.csdn.net/freewebsys/article/details/46348975 转载请注明出处. 1,关于图数据库 tinkerpop是apache孵 ...