博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
javascript事件代理(Event Delegation)
阅读量:5946 次
发布时间:2019-06-19

本文共 2038 字,大约阅读时间需要 6 分钟。

看了几篇文章,放上来供参考

司徒正美的, 

------------------------------------------------------------------自己的理解加深印象-----------------------------------------------------------------------------

What to use when

For really small event handling efforts, the classic solution gives you more control and it is pretty easy to hand over to other developers without much explanation. Event delegation however is probably the only way to keep a large app with a lot of elements to apply handling to (or dynamically loaded elements) in check.

  1. 利用事件机制,父元素的事件(click,mouseover....)去代理它下面所有元素的事件 .

这次项目里面就有这个问题,一个表格,要给每格加1个click事件,假设10行5列(数据很少很少对不对...),传统的写法也要加50个侦听,用eventdelegation 可以节省49

      2.编程中,“不想或不能直接操纵目标对象,用delegate创建一个代理来调用目标对象的方法,从而达到操纵目标对象的目的.毋庸置疑,代理对象拥有目标对象的引用”

司徒的示例代码比较简单(这里有待加深理解...看了下jq这个方法源码...理解还不到位的赶脚...)

var delegate = function(client, clientMethod) {      return function() {           return client[clientMethod].apply(client, arguments);        } }var agentMethod = delegate (client,"clientMethodName");agentMethod();

或者这种方式

var delegate = function(client, clientMethod) {      return function() {           return clientMethod.apply(client, arguments);        } }var agentMethod = delegate (client,client.method);agentMethod();

 

完整的就是

var delegate = function(client, clientMethod) {                return function() {                    return client[clientMethod].apply(client, arguments);                }            }            var ClassA = function() {                var _color = "red";                return {                    getColor : function() {                        console.log("Color: " + _color);                    },                    setColor : function(color) {                        _color = color;                    }                };            };            var a = new ClassA();            a.getColor();            a.setColor("green");            a.getColor();                        var d = delegate(a, "setColor");            d("blue");            a.getColor();

 

 

 

 

转载于:https://www.cnblogs.com/kite-Runner/p/3568673.html

你可能感兴趣的文章
3.1
查看>>
校验表单如何摆脱 if else ?
查看>>
JS敏感信息泄露:不容忽视的WEB漏洞
查看>>
分布式memcached服务器代理magent安装配置(CentOS6.6)
查看>>
Create Volume 操作(Part III) - 每天5分钟玩转 OpenStack(52)
查看>>
pxc群集搭建
查看>>
JS中加载cssText延时
查看>>
常用的脚本编程知识点
查看>>
计算机网络术语总结4
查看>>
新手小白 python之路 Day3 (string 常用方法)
查看>>
soapUI的简单使用(webservice接口功能测试)
查看>>
框架 Hibernate
查看>>
python-while循环
查看>>
手机端上传图片及java后台接收和ajaxForm提交
查看>>
【MSDN 目录】C#编程指南、C#教程、ASP.NET参考、ASP.NET 4、.NET Framework类库
查看>>
jquery 怎么触发select的change事件
查看>>
angularjs指令(二)
查看>>
<气场>读书笔记
查看>>
领域驱动设计,构建简单的新闻系统,20分钟够吗?
查看>>
web安全问题分析与防御总结
查看>>