seajs hello world
http://localhost/seajs/index.html
<!doctype html>
<head>
<title>Hello Seajs</title>
<script src="sea.js"></script>
<script>
seajs.config({
// 调试模式
debug: true,
// Sea.js 的基础路径
base: 'http://localhost/seajs/app',
// 别名配置
alias: {
"jquery": "jquery/jquery"
},
// 文件编码
charset: 'utf-8'
});
</script>
<script>
//执行模块
seajs.use("app.js");
</script> </head>
<body>
<div id="hello-seajs" >Hello SeaJS</div>
</body>
</html>
http://localhost/seajs/app/jquery/jquery.js
http://localhost/seajs/app/app.js
define(function(require,exports,module){
var $ = require("jquery");
// 引入util模块的接口
var util = require('./util');
//var helloSeaJS = document.getElementById('hello-seajs');
// 调用接口的方法
//helloSeaJS.style.color = util.randomColor();
var helloSeaJS = $("#hello-seajs");
helloSeaJS.css("color",util.randomColor());
});
http://localhost/seajs/app/util.js
define(function(require,exports,module){
var util = {};
var colorRange = ['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F'];
util.randomColor = function(){
return '#' +
colorRange[Math.floor(Math.random() * 16)] +
colorRange[Math.floor(Math.random() * 16)] +
colorRange[Math.floor(Math.random() * 16)] +
colorRange[Math.floor(Math.random() * 16)] +
colorRange[Math.floor(Math.random() * 16)] +
colorRange[Math.floor(Math.random() * 16)];
};
module.exports = util;
});
base添加规则
完整的绝对路径 不会加base
以 "." 开头 会相对于当前(被调用的)模块解析地址。 如果不存在被调用的模块(如seajs.use() ), 则会相对于当前页面解析地址。
以 "/" 开头 相对于当前页面的根目录 解析地址
普通命名 直接加上base前缀
base值
base 默认值是 seajs所在目录
seajs.config()中base的解析与ID命名解析规则相同
例如:
http://example.com/test/js/sea/sea.js
http://example.com/test/index.html
在index.html中调用了sea.js
base的默认值为 "http://example.com/test/js/sea/"
如果使用seajs.config()设置了base
seajs.config({
base: "home" // base值为 "http://example.com/test/js/sea/home"
});
seajs.confg({
base: "./home" // base值为 "http://example.com/test/home"
});
seajs.conifg({
base: "/home" // base值为 "http://example.com/home"
});
seajs hello world的更多相关文章
- seaJs学习笔记2 – seaJs组建库的使用
原文地址:seaJs学习笔记2 – seaJs组建库的使用 我觉得学习新东西并不是会使用它就够了的,会使用仅仅代表你看懂了,理解了,二不代表你深入了,彻悟了它的精髓. 所以不断的学习将是源源不断. 最 ...
- 初学seaJs模块化开发,利用grunt打包,减少http请求
原文地址:初学seaJs模块化开发,利用grunt打包,减少http请求 未压缩合并的演示地址:demo2 学习seaJs的模块化开发,适合对seajs基础有所了解的同学看,目录结构 js — —di ...
- JS模块化开发:使用SeaJs高效构建页面
一.扯淡部分 很久很久以前,也就是刚开始接触前端的那会儿,脑袋里压根没有什么架构.重构.性能这些概念,天真地以为前端===好看的页面,甚至把js都划分到除了用来写一些美美的特效别无它用的阴暗角落里,就 ...
- seajs的使用
写在前面 seajs是什么? Seajs是一个js文件加载器. 遵循 CMD 规范模块化开发,依赖的自动加载.配置的简洁清晰. 用于Web开发的模块加载工具,提供简单.极致的模块化体验 一:使用 文件 ...
- 用spm2构建seajs项目的过程
前言 Javascript模块化规范有CommonJs规范,和主要适用于浏览器环境的AMD规范,以及国内的CMD规范,它是SeaJs遵循的模块化规范.因为以前项目中用SeaJs做过前端的模块管理工具, ...
- jquery插件封装成seajs模块
jquery直接在html中引入. jquery插件修改为: define(function (require, exports, moudles) { return function (jquery ...
- 快速上手seajs——简单易用Seajs
快速上手seajs——简单易用Seajs 原文 http://www.cnblogs.com/xjchenhao/p/4021775.html 主题 SeaJS 简易手册 http://yslo ...
- seajs学习一天后的总结归纳
公司项目最近需要将js文件迁移到seajs来进行模块化管理,由于我以前主要接触模块化开发是接触的AMD规范的requireJS,没有接触过CMD规范,而且在实际项目中还没有用过类似技术.于是,我非常兴 ...
- RequireJS与SeaJS模块化加载示例
web应用越变的庞大,模块化越显得重要,尤其Nodejs的流行,Javascript不限用于浏览器,还用于后台或其他场景时,没有Class,没有 Package的Javascript语言变得难以管理, ...
- 新手 gulp+ seajs 小demo
首先,不说废话,它的介绍和作者就不在多说了,网上一百度一大堆: 我在这里只是来写写我这2天抽空对seajs的了解并爬过的坑,和实现的一个小demo(纯属为了实现,高手请绕道); 一.环境工具及安装 1 ...
随机推荐
- Asp.Net MVC及Web API框架配置会碰到的几个问题及解决方案(转)
前言 刚开始创建MVC与Web API的混合项目时,碰到好多问题,今天拿出来跟大家一起分享下.有朋友私信我问项目的分层及文件夹结构在我的第一篇博客中没说清楚,那么接下来我就准备从这些文件怎么分文件 ...
- docfx预热中
奋战了几个月,docfx终于有些像样了. 预览文档: http://aspnet.github.io/docfx/ 源代码正在准备开源中 Nuget包很快会发布 FAQ: Q: docfx是什么? A ...
- 解决 PHPExcel 长数字串显示为科学计数
解决 PHPExcel 长数字串显示为科学计数 在excel中如果在一个默认的格中输入或复制超长数字字符串,它会显示为科学计算法,例如身份证号码,解决方法是把表格设置文本格式或在输入前加一个单引号. ...
- Java 中 手动抛出异常: throw new Exception("错误信息") 错误信息的获得
当然需要先用try catch捕获,但注意new Exception("")括号里的字符串其实是异常原因,所以获取是要用ex.getCause().getMessage() int ...
- C#-WebForm-ASP开发练习:从数据库中动态添加信息
传统的ASP开发方式,是C#代码和HTML代码混合在一起,ASP与ASP.NET不是一个东西. <% %> - 可以扩起来一段范围,这一段范围之内只能允许编写C#代码 <%= ...
- 【bzoj3505】 Cqoi2014—数三角形
http://www.lydsy.com/JudgeOnline/problem.php?id=3505 (题目链接) 题意 给定一个n*m的网格,请计算三点都在格点上的三角形共有多少个. Solut ...
- NSOprationQueue 与 GCD 的区别与选用
原文链接:http://www.jianshu.com/p/d09e2638eb27 GCD 技术是一个轻量的,底层实现隐藏的神奇技术,我们能够通过GCD和block轻松实现多线程编程,有时候,GCD ...
- Character类
Character类 用来判断大小写 方法: public static boolean isUpperCase(char ch):判断是否大写 public static boolean isLow ...
- [Fluent NHibernate]第一个程序
目录 写在前面 Fluent Nhibernate简介 基本配置 总结 写在前面 在耗时两月,NHibernate系列出炉这篇文章中,很多园友说了Fluent Nhibernate的东东,也激起我的兴 ...
- arguments 对象的老历史
引题:为什么 JavaScript 中的 arguments 对象不是数组 http://www.zhihu.com/question/50803453 JavaScript 1.0 1995 年, ...