<body>
<style>
.abc{
width:100px;
height:100px;
}
</style>
<div class="abc">
</div>
<button οnclick="base.skin(1)">皮肤1</button>
<button οnclick="base.skin(2)">皮肤2</button>
<script>
var base = (function(){
var fish = '你是一个大傻瓜!!!';
var eat = function(dom){
var element = $(dom);
element.css({color:'#000',fontSize:'20px',fontWeight:'700'}).text(fish)
element.click(function(){
$(this).animate({width:'200px'},'slow',function(){
element.append("<p>变化了!</p>")
})
})
}
var skin = function(val){
$("#skin").attr('href','./css/skin'+val+'.css');
}
return {
eat:function(dom){
eat(dom);
},
skin:function(val){
skin(val);
}
}
})();
base.eat('.abc')
</script>
</body>
模块模式里面是一个闭包,与外界不相干。上面是返回一个包含两个方法的对象给base。
好处就是就算外面有一样的方法也不冲突,而且不像原型模式要new一个实例来用。直接拿来就用。