js事件委托是怎么做的

JavaScript021

js事件委托是怎么做的,第1张

我大概说下,假设:ABCD车、车行A

ABCD都要卖车,可以通过车行A可以帮ABCD车卖(委托),那当有人买车的时候,并且看上和某车,那么车行A联系到某车,告诉他们有人要买你的车,买车的细节就卖车和买车的沟通,或者ABCD告诉车行A怎么处理后面的事,然后全程给车行A处理。

这里不要考虑现实生活的猫腻那些。

/* HTML结构

<div>

    <h1>

    <h2>

    <h3>

</div>

*/

/* jQuery:$(div).on('click','>*',function(e){})

    div绑定Click事件,H1、2、3是没有绑定Click事件的。

    H1、2、3没有自己做,但是委托div做,而且相对应的处理事件由H1、2、3自己来处理,

    或者H1、2、3告诉div要怎么处理。

*/

jQuery中用on来绑定事件,常用写法

两种写法哪个更好?

1. $(document).on 将事件委托document, $('#idname').on 将事件绑定到.className元素上。每次document有点击动作,浏览器都会判断当前点击的对象。如果匹配再决定要不要执行,多了个判断环节。JS渲染效率很高,所以此异同基本可以忽略。

2. $("className").on 为onclick绑定,只有在页面onload时执行一次。页面刷新后,新加载的具有className的元素便没有事件绑定到上面了。相反$(document).on这种方法会刷新和重新赋予绑定操作,所以一定程度上更为全面。

把事件委托给tbody:

window.onload=function(){

   document.getElementById("tbodys").onclick=function(e){

      var t=(e||event).target

      if(t.tagName=="A")t.innerHTML="你点了我!"  //只是个例子

   }

}