<html>
<body>
<a>我是好人</a>
<script>
var module1 = (function (mod) {
mod.a = $("a").html();
mod.show = function () {
alert(mod.a);
}
return mod;
})(window.module1 || {});
$(function () {
module1.show();
})
</script>
</body>
</html>
要想正确获取a中的html,必须将立即执行函数放到html后面
但是,一般页面开发,习惯性的把js代码放在页头
<html>
<head>
<script>
var module1 = (function (mod) {
mod.a = $("a").html();
mod.show = function () {
alert(mod.a);
}
return mod;
})(window.module1 || {});
$(function () {
module1.show();
})
</script>
</head>
<body>
<a>我是好人</a>
</body>
</html>
就会导致页面dom元素还未加载的时候就执行了定义的函数,访问不到a中元素
想到的解决办法
<html>
<head>
<script>
var module1 = (function (mod) {
mod.init = function () {
mod.a = $("a").html();
}
mod.show = function () {
alert(mod.a);
}
return mod;
})(window.module1 || {});
$(function () {
module1.show();
})
</script>
</head>
<body>
<a>我是好人</a>
</body>
</html>
您有什么好的建议吗
推荐大家读下这篇关于javascript模块化管理的文章