JavaScript的封装:
JavaScript函数是最原始,最基础的封装,懂js一目了然,如果你的页面不需要很多js交互操作,就可以用这种简单的方式。
function hello(){ var a = 'hello'; alert(a); }
JavaScript创造者给我们提供了一个叫匿名函数,顾名思义,匿名函数就是没有实际名字的函数,它的格式很多种, !function(){}() , (function(){})() , (function(){}()) , new function(){} , void function(){}(); JQuery.js就是一个匿名函数封装,先看最常用的
(function(){ star.init = (function(name){ var e = new Editor(name, Data.toolbarData); }); })();
先通过prototype继承方式把每一个小的操作封装成属性,init和closeWindow,然后可以进行初始化加载如my.init();也可以绑定到某个操作事件上如$("#contact").add(my.closeWindow());这些封装一气而成。
var myOpinion = myOpinion || {}; myOpinion.prototype={ init:function(obj,i){ alert('hello'); }, closeWindow:function(obj,d){ obj.click(function(){ d.hide(); }); } } $(function(){ var my = myOpinion.prototype; my.init($(".z-sidebar li em"),$("#contact")); $("#contact").add(my.closeWindow($(".z-sidebar li em"),$("#contact"))); });
还有定义单个属性封装
WinShow.create = function(c,body){ var _head = '<div class="+ c.heacss +"><span class="+ c.concss +">' + c.title + '</span></div>'; this.container.innerHTML = _head; return this.container; this.container.onclick = function(e){ alert('hello'); } }
在这里创建一个create属性以匿名函数形式封装一段HTML代码,并给这个 HTML代码绑定点击事件。
想要了解更多前端知识,可访问 前端开发学习!!
以上就是如何封装javascript?的详细内容,更多请关注0133技术站其它相关文章!