requirejs(模块化)
<script src="../../dist/js/require.js" data-main="../../dist/js/main.js"></script>
main.js:
requirejs.config({
paths: {
jquery: 'plugins/jQuery/jquery-2.2.3.min',
icheck: 'plugins/iCheck/icheck.min'
}
});
requirejs(['jquery','icheck'],function($) {
$('.checkLine').iCheck({
checkboxClass: 'icheckbox_flat-blue',
radioClass: 'icheckbox_flat-blue',
});
});
require.config({
baseUrl: "js/lib",改变基目录
paths: {
"jquery": "jquery.min",
"underscore": "underscore.min",
"backbone": "backbone.min"
}
});
http://www.ruanyifeng.com/blog/2012/11/require_js.html
http://www.requirejs.cn/
https://gitee.com/qiaozh/codes/coamv6il59gw3n0kp421x49
所谓的模块化:将一个个函数封装在一个对象里,再将该对象赋值给一个全局变量
(function($){
var courseObj = {
name:'笑话',
set:function(){
},
openCourseBook:function(){
},
printCourse:function(){
}
};
window.courseService = courseObj;
})(jQuery || {})
或
var courseService = (function($){
var courseObj = {
name:'笑话',
set:function(){
},
openCourseBook:function(){
},
printCourse:function(){
}
};
return courseObj;
})(jQuery || {})
当出现依赖关系:(缺陷:引入时被调用的需要放在前面)
<script src="./courseSkin.js"></script>
<script src="./courseTable.js"></script>
courseSkin.js:
(function($){
var skin = {
name:'ccc',
get:function(){
alert(this.name);
}
};
window.courseSkin = skin;
})(jQuery || {})
courseTable.js:
(function($,courseSkin){
var courseObj = {
name:'笑话',
set:function(){
alert(this.name);
},
openCourseBook:function(){
courseSkin.get();//调用courseSkin
},
printCourse:function(){
alert("printCourse");
}
};
window.courseService = courseObj;
})(jQuery || { },courseSkin)