js事件委托是怎么做的

JavaScript014

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="你点了我！"  //只是个例子

   }

}