sea.js的使用
阿新 • • 發佈:2018-12-30
sea.js外掛的使用案例
在用到seajs的頁面中用script標籤應用seajs檔案,在引入的html檔案中t新增一段配置程式碼:
在頁面中載入模組
// seajs 的簡單配置
seajs.config({
base: "../sea-modules/",
alias: {
"jquery": "jquery/jquery/1.10.1/jquery.js"
}
})
// 載入入口模組
seajs.use("../static/hello/src/main")
特別注意:
在script中的配置檔案是對於html所處的位置而言
模組程式碼
在html頁面中引入js檔案中的使用方法:
1.模組程式碼(index.html的static/index/main.js新增如下程式碼)
define(function(require,exports,module) {
// var title= document.getElementById('title');
// title.innerHTML = "yes it works";
var changeText = require('../change_text.js');
var title = document.getElementById('title');
title.innerHTML = changeText.text;
})
- jquery程式碼(lucky的static/lucky/main.js新增如下程式碼)
let lucky = new Lucky();
lucky.printTxt('#lucky');
function Lucky(){
let _this = this;
_this.printTxt = function(tags){
$(tags).html('good lucky');
}
}
目錄結構
|– modules 存放 seajs、jquery 等檔案,這也是模組的部署目錄
|– static 存放各個專案的 js、css 檔案
| |– hello
| -- lucky<br>
|– index.html
`– lucky.html