index.html——主页面。
sea.js——SeaJS脚本。
init.js——init模块,入口模块,依赖data、jquery、style三个模块。由主页面载入。
data.js——data模块,纯json数据模块,由init载入。
jquery.js——jquery模块,对 jQuery库的模块化封装,由init载入。
style.css——CSS样式表,作为style模块由init载入。
sea.js和jquery.js的代码属于库代码,就不赘述,这里只给出自己编写的文件的代码。
html:
<!DOCTYPE HTML> <htmllang="zh-CN"> <head> <metacharset="UTF-8"> <title></title> </head> <body> <divid="content"> <pclass="author"></p> <pclass="blog"><ahref="#">Blog</a></p> </div> <scriptsrc="./sea.js"data-main="./init"></script> </body> </html>
javascript:
//init.js define(function(require, exports, module) { var $ = require('./jquery'); var data = require('./data'); var css = require('./style.css'); $('.author').html(data.author); $('.blog').attr('href', data.blog); }); //data.js define({ author:'ZhangYang', blog:'http://leoo2sk.cnblogs.com' });
css:
.author{color:red;font-size:10pt;} .blog{font-size:10pt;}
[1] SeaJS主页 – http://seajs.com
[2] SeaJS的GitHub库(可获取源码) – https://github.com/seajs/seajs
[3] SeaJS作者玉伯的博客 - http://lifesinger.wordpress.com/