seajs hello world
2024-09-20 16:10:54
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"
});
最新文章
- Quartz框架
- 1003. Emergency (25)
- java文件上传到服务器
- Qemu+gdb跟踪内核源码
- MySql Error: Can&#39;t update table in stored function/trigger
- mongodb基础系列——数据库查询数据返回前台JSP(一)
- 关于.NET前后台提示框的那点事
- Delphi-CompareText 函数
- go pkg
- 201521123049 《JAVA程序设计》 第1周学习总结
- jq实现数字增加或者减少的动画
- springMVC源码分析--异常处理机制HandlerExceptionResolver执行原理(二)
- 一款好用的JS时间日期插件layDate
- 日志监控工具安装:windows上安装elk
- css 渐变动画
- 【剑指offer】整数中1出现的次数,C++实现
- iOS开发神器InjectionIII
- CentOS7配置redis主从复制
- beta版本前准备
- php 数字小写转为大写的函数