1. 首先引入 require.js
2.构建首页 ,在首页中加载模块 student,teacher
<script> require(["student","teacher"],function(){ //这里是首页模块的自己的逻辑 console.log('首页模块'); }); </script>
3.student 模块 ,在模块里面加载studentDetail 模块
define(["studentDetail"],function(){ console.log('学生模块'); //需要在student模块内部调用studentDetail模块? //-->需要student模块内部引用studentDetail的路径 })
教师模块,在模块里面加载teacherDetail模块
define(["teacherDetail"],function(){ console.log('教师模块'); })
4.studentDetail 模块的内容:
define([],function(){ console.log('学生模块详细信息'); })
teacherDetail 模块的内容:
define([],function(){ console.log('教师模块详细信息'); })
5. 效果:
首页最后才被加载,递进加载,由小到大
基本用法
基本用法 //1、通过script标签导入requirejs源文件 //2、编写模块文件,基本格式如下: //student.js define([],function(){ console.log('student模块'); }) //teacher.js define([],function(){ console.log('teacher模块'); }) //3、首页调用模块: require(["student.js","teacher.js"],function(){ //编写后面的逻辑代码 }) //等价于: require(["student","teacher"],function(){ })