SeaJS项目完整实例【转】

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/

 

posted @ 2014-04-16 14:53  jamesbd  阅读(530)  评论(0)    收藏  举报