工作总结 -- 大易云计算

前端工作中的一些实践总结，以便对后期的开发生涯做下基垫。h5,css3,js,以及主流的框架react,vue的使用总结，及前端打包构建的利器webpack的总结和爬坑笔记。

1. js渲染的dom无法监听事件的解决办法和反思

在做jsp页面的前端时，发现列表项的复选框无法绑定事件，这是由于列表项都是js动态生成的，无法监听和绑定事件，这个时候可以通过事件代理来实现对列表项的事件绑定。即在document或者动态渲染项的父元素上添加事件监听，代理到列表项。
下面送给大家一个事件代理的例子。

function delegateEvent(wrap,selector,type,fn){
  if(wrap.addEventListener){
    wrap.addEventListener(type,cb);
  }else{
    wrap.attachEvent("on" + type,cb);
  }
  function cb(e){
    var e = e || window.e;
    var target = e.target || e.srcElement;
    if(matchSelector(target,selector)){
      if(fn){
        fn.call(target,e);
      }
    }
  }
}

function matchSelector(ele,selector){
  //传递ID
  if(selector.charAt(0) === '#'){
    return ele.id === selector.slice(1);
  }
 //传递class
  if(selector.charAt(0) === "."){
    return (ele.className + " ").indexOf(selector.slice(1) +" ")!=-1;
  }
 //传递tagName
  return ele.tagName.toLowerCase() === selector.toLowerCase();
}

var ul = document.getElementById("ulList");
delegateEvent(ul,"a","click",function(){
  alert("click trigger!");
})