下载网址:requirejs.org/
使用RequireJS的必要性:
1.有效防止命名冲突
2.声明不同js文件之间的依赖
3.可以让代码以模块化的方式组织起来
使用时需要将require.js文件复制到项目目录下
三个重要的函数:
requirejs.config(); requirejs(); define();
使用示例:
1、在<script></script>中引入require.js文件。
<
body
>
<
form
action=
""
method=
"POST"
>
<
textarea
name=
"text"
rows=
"10"
cols=
"30"
placeholder=
"文本域可以调整大小"
></
textarea
>
</
form
>
<
script
src=
"js/requirejs.js"
data-main=
"js/main"
></
script
>
</
body
>
<
body
>
<
form
action=
""
method=
"POST"
>
<
textarea
name=
"text"
rows=
"10"
cols=
"30"
placeholder=
"文本域可以调整大小"
></
textarea
>
</
form
>
<
script
src=
"js/requirejs.js"
data-main=
"js/main"
></
script
>
</
body
>
其中,data-main是入口文件:加载完require.js时立马调用的文件。
2、编辑main.js文件
requirejs.
config(
{
paths:{
jquery:
'jquery-1.11.3.min'
}
}
);
requirejs([
'jquery',
'validate'],
function(
$,
validate){
$(body).
css(
'background',yellow);
console.
log(
validate.
isEqual(
1,
4));
});
requirejs.
config(
{
paths:{
jquery:
'jquery-1.11.3.min'
}
}
);
requirejs([
'jquery',
'validate'],
function(
$,
validate){
$(body).
css(
'background',yellow);
console.
log(
validate.
isEqual(
1,
4));
});
3.编辑validate.js文件
define([
'jquery'],
function(
$){
return{
isEmpty:
function(){},
checkLength:
function(){},
isEqual:
function(
str1,
str2){
return str1===str2;
}
}
});
define([
'jquery'],
function(
$){
return{
isEmpty:
function(){},
checkLength:
function(){},
isEqual:
function(
str1,
str2){
return str1===str2;
}
}
});