立即执行函数问题

<html>

<body>

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模块化管理的文章

http://www.ruanyifeng.com/blog/2012/10/javascript_module.html

欢迎大家多多交流