1.什么是观察者模式
一个元素发生变化,这个元素的观察者执行一些事件。
2.例子
这里就把点击事件做成观察者模式,先注册事件在观察者的对象列表里,一旦触发事件,就回执行事件函数。
<body> <div id="box">123123123</div> <script> (function () { var observer = {}; //要监听的对象列表,例子 /* * 'dom':document.getElementById('box'), 'type':'click', 'fn': function () { console.log(1111222222221); } * * */ observer.list = []; //监听函数 observer.listen = function (obj) { this.list.push(obj); }; //发布监听 observer.publish = function () { var that = this; for(var i=0;i<this.list.length;i++) { this.list[i]['dom'].addEventListener(this.list[i]['type'],(function(i){ return function(){ that.list[i]['fn'](); } })(i)) } } //监听一个点击事件 observer.listen({ 'dom':document.getElementById('box'), 'type':'click', 'fn': function () { console.log(1111222222221); } }); //发布 observer.publish(); }()) </script> </body>