官网:http://www.requirejs.cn/

使用方法:

1、引入require.js

可以在底部引入:

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

或者放在head中

<script type="text/javascript" src="js/require.js" defer="true" async="true" data-main="js/main" ></script>

async属性表明这个文件需要异步加载,避免网页失去响应。IE不支持这个属性,只支持defer,所以把defer也写上,这个对于提高网页载入速度是挺明显的。

data-main属性的作用是,指定网页程序的主模块,即整个网页的入口代码,这里假设我的主模块main.js

2、定义一个模块(每个Javascript文件应该只定义一个模块):

//demo.js
define(function(){
var demo={};
demo={
add:function(){
console.log('add tinyphp');
},
init:function(){
console.log('init tinyphp');
}
}
return demo;
});

3、主模块调用其他模块

先看下require函数的定义,第一个参数是数组,第二个是回调函数

//main.js
require(['demo'],function(demo){
console.log(demo.add());
})

>>下载例子

RequireJs 入门的更多相关文章

  1. RequireJS入门(三)转

    这篇来写一个具有依赖的事件模块event.event提供三个方法bind.unbind.trigger来管理DOM元素事件. event依赖于cache模块,cache模块类似于jQuery的$.da ...

  2. RequireJS入门(二) 转

    上一篇是把整个jQuery库作为一个模块.这篇来写一个自己的模块:选择器. 为演示方便这里仅实现常用的三种选择器id,className,attribute.RequireJS使用define来定义模 ...

  3. RequireJS入门(一) 转

    RequireJS由James Burke创建,他也是AMD规范的创始人. RequireJS会让你以不同于往常的方式去写JavaScript.你将不再使用script标签在HTML中引入JS文件,以 ...

  4. RequireJS入门与进阶

    RequireJS由James Burke创建,他也是AMD规范的创始人. RequireJS会让你以不同于往常的方式去写JavaScript.你将不再使用script标签在HTML中引入JS文件,以 ...

  5. RequireJS入门(三)

    这篇来写一个具有依赖的事件模块event.event提供三个方法bind.unbind.trigger来管理DOM元素事件. event依赖于cache模块,cache模块类似于jQuery的$.da ...

  6. RequireJS入门(二)

    上一篇是把整个jQuery库作为一个模块.这篇来写一个自己的模块:选择器. 为演示方便这里仅实现常用的三种选择器id,className,attribute.RequireJS使用define来定义模 ...

  7. RequireJS入门(一)

    RequireJS由James Burke创建,他也是AMD规范的创始人. RequireJS会让你以不同于往常的方式去写JavaScript.你将不再使用script标签在HTML中引入JS文件,以 ...

  8. RequireJS 入门指南

    RequireJS 入门指南 http://requirejs.org/ 简介如今最常用的JavaScript库之一是RequireJS.最近我参与的每个项目,都用到了RequireJS,或者是我向它 ...

  9. requireJS入门

    RequireJS 下载地址 : http://requirejs.org 什么是 requireJS ?以下是官方网站上的解释: RequireJS is a JavaScript file and ...

  10. RequireJS入门之二——第二例(写自己的模块)

    第一节遗留的问题: 中文乱码:  修改require.js文件,搜索charset 关键字,修改为GBK:(貌似乱不乱码和jquery版本有问题,切换GBK和utf-8!!) 路      径:  仅 ...

随机推荐

  1. Spring - IoC(5): 集合属性的注入

    如果 Bean 的属性是个集合,则可以使用 <list/>.<set/>.<map/> 和 <props/> 元素向 List.Set.Map 和 Pr ...

  2. 51nod 1060 最复杂的数

    把一个数的约数个数定义为该数的复杂程度,给出一个n,求1-n中复杂程度最高的那个数.   例如:12的约数为:1 2 3 4 6 12,共6个数,所以12的复杂程度是6.如果有多个数复杂度相等,输出最 ...

  3. swift c++ oc 混编

    http://www.tuicool.com/articles/QZNrErM iOS 里面 Swift与Objective-C混编,Swift与C++混编的一些比较 时间 2015-03-23 23 ...

  4. python多线程实现多任务

    #转载请联系 1.什么是线程? 进程是操作系统分配程序执行资源的单位,而线程是进程的一个实体,是CPU调度和分配的单位.一个进程肯定有一个主线程,我们可以在一个进程里创建多个线程来实现多任务. --- ...

  5. mybatis-config.xml的解释(zz)

    <!-- xml标准格式 --><?xml version="1.0" encoding="UTF-8"?>  <!DOCTYPE ...

  6. 腾讯云 python3+Django

    !!!注意:如果已经包含了python3.5,跳过安装3.6版本. !!!本人安装完3.6后,pip3安装的包始终没法安装到3.6目录下,只能安装到3.5目录下 1,安装python3.6(用编译的方 ...

  7. 转载 Ofbiz 入门教程

    1.Ofbiz 介绍: Ofbiz(http://www.ofbiz.org) 是 Open Source 的商务软件系统,充分利用了各优秀的的Open Source 项目,像 Tomcat, Ant ...

  8. laravel将数据库对象转为数组的方法

    亲测有效 array_map('get_object_vars', $data);

  9. EasyUI----DataGrid行明细增删改操作

    http://blog.csdn.net/huchiwei/article/details/7787947   本文实现的是EasyUI-DataGrid行明细的增删改操作.具体参考来自以下文章: 官 ...

  10. Codeforces 811 A. Vladik and Courtesy

    A. Vladik and Courtesy   time limit per test 2 seconds memory limit per test 256 megabytes input sta ...