JS事件委托的设计模式_第1页
全文预览已结束

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

1、js事件委托的设计模式在实际开发中,常常需要为dom元素绑定大事,假如页面上有4个li元素,点击对应的li,弹出对应的li内容,怎么做呢?是不是很容易?大多数人的做法都是:猎取元素,绑定大事假如页面上有1w个元素, 甚至10w个元素呢?继续用法上述方式,会有很大的性能问题,这个时候,有人可能要问,实际中的项目 哪有1w个,10w个元素的。普通的项目可能没有,但是社交类的网站,如微博,其他的如大批量文件上传等能功能,都是需要动态创建dom元素,而且数量巨大,并且创建出来的dom元素,普通都需要绑定大事和相应的特效。普通状况下,用一般的绑定大事方式是不能给动态创建的dom元素绑定到大事的,所以这里

2、就产生了两个问题:1,当页面元素无数的时候,假如给这些元素绑定上大事?2,当动态创建dom时,假如给动态创建的dom绑定上大事和相应的特效?这就是本文需要研究的模式-托付模式采纳大事托付可以顺当解决上面2个问题那么,什么是大事托付呢?给元素的父元素绑定大事,利用冒泡原理,当子元素触发大事的时候,会去触发父元素的大事,然后把相应的业务规律放在父元素的大事中去处理。通俗点讲就是,子元素不做大事绑定,把绑定大事的操作托付给父元素,这就叫做大事托付, 托付有一个特性,他能够在大事触发中,识别到详细是由哪个子元素触发的,这个就是大事对象的target属性当我们点击li的时候,就能通过大事对象oevent

3、.target识别到触发大事的li元素, srcelement是兼容ie的写法。在没有大事托付之间,我们通过javascript做一个hover的功能,普通这么做.假如li元素无数,就会产生性能问题,而采纳托付模式,我们可以这么做通过大事托付,把元素绑定到父元素,大大提高性能至此,我们解决了第一个问题:当页面元素无数的时候,假如给这些元素绑定上大事对于新创建的dom元素,一般绑定大事的方式,是不能绑定到这些dom元素的新创建的li元素,是不能绑定到onmouseover和onmouseout大事的,我们采纳托付模式之后,可以这么做至此,我们解决了其次个问题:当动态创建dom时,假如给动态创建的dom绑定上大事和相应的特效最后,我们结合托付模式,来实战一

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论