资讯专栏INFORMATION COLUMN

拒绝动态event绑定

My_Oh_My / 1680人阅读

摘要:开始流行的时候,大多数人更喜欢而不是,原因也很明显粗暴简单有效。并且动态绑定事件通常不是一个持续行为,只有那么一瞬间就把事件绑上了,但如果给添加了新元素,它不会自动绑定事件,仍然需要在追加元素后再进行绑定。如有不足的地方,欢迎指出。

jquery开始流行的时候,大多数人更喜欢jQuery.bind("click")而不是onclick="click(this)",原因也很明显:粗暴简单有效。之后以下的代码比较常见:

click

但同时产生出不少结构性问题。web前端不外乎html、 css、 javascript,可这三种代码又截然不同,如何组织这些代码成了头痛问题。在多数情况下HTML代码量非常多,如果混合js一起阅读会很难理解,html和js的关系变得越来越模糊,以上代码如果拆分放置到两处,甚至很难发现它们之间有关系。并且动态绑定事件通常不是一个持续行为,只有那么一瞬间就把事件绑上了,但如果给document添加了新元素,它不会自动绑定事件,仍然需要在追加元素后再进行绑定。

现在有很多MVC, MVVM框架可以解决结构性问题,但对于大多数情况,我们并不需要一套框架,而只需要百余行代码就能解决问题,何必给页面增加更多东西呢?

快速开发是常态,它看起来不重要,但积少成多就变得十分重要。我们应该在开始编写这些看似微不足道的代码前去考虑如何把紧耦合关系变松。从以上代码可见耦合度高是因为关系信息少,而且难以重用,所以我认为应该在之间增加一层关系。

click

Action是个不存在的object,但其实要实现这个object的效果很简单,不需要很长的开发经验就可以办到,并且不需要jquery。代码看上去简单,但轻松解决了以上我提到的问题。如有不足的地方,欢迎指出。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/79027.html

相关文章

  • vue项目前端知识点整理

    摘要:在如下几个属性,表示当前的真实时间,用于和服务器时间同步,表示创建时间,主要用于分页,以及重连时的判断,表示是否断线重连。初始化连接时,将赋值为当前本地时间,连接成功后,将赋值为服务器返回的当前时间,再设置一个定时器,保持时间与服务器一致。 vue项目前端知识点整理 微信授权后还能通过浏览器返回键回到授权页 在导航守卫中可以在next({})中设置replace: true来重定向到改...

    bang590 评论0 收藏0
  • JavaScript——基础篇

    摘要:这个过程中发生了绑定,举例如下小明小明,优先级这里不再一一举例对比优先级,直接给出结论绑定显示绑定隐式绑定默认绑定,有兴趣的同学可以实际比对一下。 把知识串一串,连成线,形成体系,从此走上大神之路啦,道路可能会曲折一点,但是咸鱼也要翻一翻身撒~ 一、变量提升 何为变量提升? 在JavaScript中,函数及变量的声明都将被提升到函数的最顶部 (函数声明的优先级高于变量声明的优先级) 这...

    周国辉 评论0 收藏0
  • JavaScript——基础篇

    摘要:这个过程中发生了绑定,举例如下小明小明,优先级这里不再一一举例对比优先级,直接给出结论绑定显示绑定隐式绑定默认绑定,有兴趣的同学可以实际比对一下。 把知识串一串,连成线,形成体系,从此走上大神之路啦,道路可能会曲折一点,但是咸鱼也要翻一翻身撒~ 一、变量提升 何为变量提升? 在JavaScript中,函数及变量的声明都将被提升到函数的最顶部 (函数声明的优先级高于变量声明的优先级) 这...

    hot_pot_Leo 评论0 收藏0
  • JavaScript——基础篇

    摘要:这个过程中发生了绑定,举例如下小明小明,优先级这里不再一一举例对比优先级,直接给出结论绑定显示绑定隐式绑定默认绑定,有兴趣的同学可以实际比对一下。 把知识串一串,连成线,形成体系,从此走上大神之路啦,道路可能会曲折一点,但是咸鱼也要翻一翻身撒~ 一、变量提升 何为变量提升? 在JavaScript中,函数及变量的声明都将被提升到函数的最顶部 (函数声明的优先级高于变量声明的优先级) 这...

    yzd 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<