Skip to content

Instantly share code, notes, and snippets.

@sofish

sofish/sea_in_action.html

Created August 3, 2012 12:52
Show Gist options
  • Save sofish/3247428 to your computer and use it in GitHub Desktop.
Save sofish/3247428 to your computer and use it in GitHub Desktop.
Download ZIP
using seajs
Raw
sea_in_action.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Loader</title>
<link href="http://typo.sofish.de/typo.css" rel="stylesheet" />
<style type="text/css">
code{padding:0 2px;border:1px solid #eee;background:#f7f7f7;border-radius:3px;}
#geo{color:#08c;}
</style>
<script src="http://test.com:8080/static/??sea/sea.js,sea/plugin-combo.js"></script>
</head>
<body class="typo" style="padding:20px 60px;">
<h3>＃测试异步加载</h3>
<blockquote id="test">
我现在的位置是：<span id="geo">Loading...</span>
</blockquote>
<h3>＃动态加载 github repo 信息</h3>
<blockquote id="repo">
</blockquote>
<h3>＃开发原则</h3>
<ul>
<li>默认框架 module 不应该用 seajs 来加载
<p>sea 使用的是传统的 script insertion，默认框架一来永远都是不动的，二来总是需要最先载入的，如果使用 <code>seajs.use()</code> 加载则会产生 insertion 这个过程，反而让页面更慢。</p>
</li>
</ul>
<h3>＃注意点</h3>
<ul>
<li>所有 module 都需要经过 <code>seajs.define()</code> 预先定义
<p>可以参考现有这个 <a href="http://test.com:8080/static/modules/jquery-1.7.2.min.js">jQuery-1.7.2.min.js</a>。
</li>
<li>版本可以利用 <code>seajs.config()</code> 中配置 <code>alias</code> 来实现别名。不建议直接删除版本号
</ul>
<script>
seajs.config({
base: 'http://test.com:8080/static/modules/',
alias: {
jquery: 'jquery-1.7.2.min.js'
}
});
seajs.use(['jquery', 'geolocation'], function($, geo){
geo(function(coords){
$('#geo').html(coords.latitude + ', ' + coords.longitude);
}, function(err){
alert('error occurred: ' + err);
})
});
seajs.use(['jquery', 'repo'], function($, repo){
$('#repo').repo({ user: 'sofish', name: 'typo.css' });
});
seajs.use('test', function(test){
console.log('模块会在 use 的时候立即执行');
})
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment