介绍

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. php实现求扑克牌顺子(*****)(AC)(分类:把问题分小,利于排错)

    php实现求扑克牌顺子(*****)(AC)(分类:把问题分小,利于排错) 一.总结 分类(那就可以把问题分小而逐步完成每个板块,这样是很简单的) 分类还有助于查错 二.php实现求扑克牌顺子 题目描 ...

  2. hadoop集群ambari搭建(1)之ambari-server安装

    Apache Ambari是一种基于Web的工具,支持Apache Hadoop集群的供应.管理和监控. Ambari眼下已支持大多数Hadoop组件,包含HDFS.MapReduce.Hive.Pi ...

  3. js如何实现动态的在表格中添加和删除行?(两种方法)

    js如何实现动态的在表格中添加和删除行?(两种方法) 一.总结 1.table元素有属性和一些方法(js使用) 方法一:添加可通过在table的innerHTML属性中添加tr和td来实现 tab.i ...

  4. 公布一个基于CSDN Code的学习測试仓库

    使用CSDN Code代码托管平台有一段时间了,今天新建立了一个公开的仓库https://code.csdn.net/smstong/learngit/tree/master,供大家測试合并请求等协作 ...

  5. php正则及常用正则函数怎么用

    php正则及常用正则函数怎么用 一.总结 一句话总结: 能够使用正则的函数:preg_match();preg_match_all();preg_replace();preg_grep();preg_ ...

  6. matlab 实现 stacked Autoencoder 解决图像分类问题

    Train Stacked Autoencoders for Image Classification 1. 加载数据到内存 [train_x, train_y] = digitTrainCellAr ...

  7. Using Eredis, Redis With Erlang

    http://no-fucking-idea.com/blog/2012/03/23/using-eredis-in-erlang/ Using Eredis, Redis With Erlang M ...

  8. 详细回复某个CSDN网友,对我的文章和技术实力以及CSDN的吐槽

    貌似被大学生鄙视了,我也是醉了,现在的大学生水平和信心,都这么高了~ 看来,我得加把劲了~ o(︶︿︶)o 电子商务系列文章,是我闲来无事,分享自己的一些业余实践经验的文章.其中关于数据库设计的这一篇 ...

  9. HDU 1789 Doing Homework again(馋)

    意甲冠军  参加大ACM竞争是非常回落乔布斯  每一个工作都有截止日期   未完成必要的期限结束的期限内扣除相应的积分   求点扣除的最低数量 把全部作业按扣分大小从大到小排序  然后就贪阿  能完毕 ...

  10. C#性能优化:延迟初始化Lazy

    1. 概述 我们创建某一个对象需要很大的消耗,而这个对象在运行过程中又不一定用到,为了避免每次运行都创建该对象,这时候延迟初始化(也叫延迟实例化)就出场了. 延迟初始化出现于.NET 4.0,主要用于 ...