利用事件委托实现点击li列表

• 事件委托就是事件冒泡加事件源，给父类元素绑定事件，来监听子元素的冒泡事件，并找到是哪个子元素(事件源)的事件点击事件绑定在 ul 上

// html
 

    
1
    
2
    
3
    
4
  
// js
 var uls = document.getElementsByTagName('ul')[0];
  uls.addEventListener('click', function (e) {

    var event = e || window.event;

    //监听事件源
    var src = event.target || event.srcElement;
    console.log(src.innerText);
  }, false)

• 给单个 li 添加点击事件

// html
 

    
1
    
2
    
3
    
4
  
// js
  var lis = document.getElementsByTagName('li');
  for (var i = 0; i < lis.length; i++) {
    //防闭包
    (function (j) {
      lis[i].addEventListener('click', function () {
        console.log(lis[j].innerText);
      }, false)
    }(i))
  }