一、equireJS 和 SeaJS 都是很不错的模块加载器，两者区别如下
1. 两者定位有差异。RequireJS 想成为浏览器端的模块加载器，同时也想成为 Rhino / Node 等环境的模块加载器。SeaJS 则专注于 Web 浏览器端，同时通过 Node 扩展的方式可以很方便跑在 Node 服务器端
2. 两者遵循的标准有差异。RequireJS 遵循的是 AMD（异步模块定义）规范，SeaJS 遵循的是 CMD
RequireJS会让你以不同于往常的方式去写JavaScript。你将不再使用script标签在HTML中引入JS文件，以及不用通过script标签顺序去管理依赖关系。也不会有阻塞（blocking）的情况发生
二、RequireJS的模块入口
script标签上一个自定义属性：data-main="main"，等号右边的main指的main.js。这个main指主模块或入口模块。
main.js中就两个函数调用require.config和require。
require.config用来配置一些参数，它将影响到requirejs库的一些行为。
require.config的参数是一个JS对象，常用的配置有baseUrl，paths等。
<script data-main="js/main" src="require.js.js"></script>
main.js
1 require.config({ 2 paths: { 3 jquery: 'jquery-1.7.2' 4 } 5 }); 6 7 require(['jquery'], function($) { 8 alert($().jquery); 9 });
paths参数，使用模块名“jquery”，其实际文件路径jquery-1.7.2.js（后缀.js可以省略）。
我们知道jQuery从1.7后开始支持AMD规范，即如果jQuery作为一个AMD模块运行时，它的模块名是“jquery”。注意“jquery”是固定的，不能写“jQuery”或其它。
注：如果文件名“jquery-1.7.2.js”改为“jquery.js”就不必配置paths参数了。
三、定义模块和读取模块
1、定义模块
selector.js
1 define(function() { 2 function query(selector,context) { 3 alert(selector, context); 4 } 5 return query; 6 });
2、读取模块
参数1为获取的js文件可以不写扩展名，第二个参数要执行的事
1 require(['selector'], function(query) { 2 var els = query('.wrapper'); 3 console.log(els) 4 });
四、模块的依赖
<script data-main="main.js" src="require.js"></script>
主模块main
1 require.config({ 2 baseUrl: 'js', // baseUrl指的模块文件的根目录，可以是绝对路径或相对路径。这里用的是相对路径。 3 parth: { 4 $: "http://public.zgzcw.com/shared/jquery-1.7.1.min.js?v=20140717123" 5 } 6 }); 7 8 // 引用模块 9 require(['lab', "event"], function(query, e) { 10 var els = query('#tagName'); 11 e.bind(); 12 e.unbind(); 13 });
lab.js
1 // 定义一个模块 2 define(function(){ 3 4 function tag(id){ 5 $(id + " li").click(function(){ 6 if($(this).hasClass("active")){ 7 $(this).removeClass("active"); 8 } 9 else{ 10 $(this).addClass("active"); 11 } 12 }) 13 } 14 15 return tag; 16 })
event.js
1 define(["lab"], function(lab){ // 引用lab.js 2 3 var bind = function(){ 4 5 } 6 7 var unbind = function(){ 8 9 } 10 11 return { 12 bind: bind, 13 unbind: unbind 14 } 15 })