因为习惯了jq中去用on()去实现事件委派，原生的反而有点遗忘，所以写个小例子回顾下，当然jq的写法比原生的用起来实在方便太多了。
原生js的事件委派：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>原生事件委派</title>
</head>
<body>
<ul id = "oUl">
<li class = "item">1</li>
<li class = "item">2</li>
<li class = "item">3</li>
<li class = "item">4</li>
<li class = "item">5</li>
</ul>
<button id="btn">add</button>
</body>
<script>
var items=document.querySelectorAll('.item');
var oUl=document.getElementById('oUl');
var btn=document.querySelector('#btn');
var num=6;
oUl.addEventListener('click',function (ev) {
ev=ev||window.event;
var target=ev.target;
console.log(target)
// 获取目标元素
if (target.nodeName == 'LI') {
alert(target.innerHTML);
}
});
btn.onclick=function () {
var ite=document.createElement('li');
ite.setAttribute('class','item');
ite.innerHTML=num;
// var ite="<li class ='item'>"+num+"</li>";
oUl.appendChild(ite);
num++;
}
</script>
</html>