[js]事件委托考察

[f2ebill]

<ul>
  <li class='target'>
      <span>test</span>
 </li>
</ul>

• 点击class为 target 的li可以 alert 出其所含内容（如上方代码点击弹出“test”）
• 在ul动态新增li元素的情况下，也要有相同效果
• 使用原生js实现，不使用jQuery

[VaJoy]

挽尊

    var ul = document.querySelector('ul');
    ul.addEventListener('click', function (e) {
        var target = e.target,
            f = function (t) { console.log(t);
                var className = t.className;
                if (t.tagName === 'LI' && className && className.indexOf('target') >= 0) {
                    alert(t.innerHTML)
                } else if(t != ul) {
                    f(t.parentNode)
                }
            };
        f(target)
    }, false)

[xifengxx]

`var ul = document.querySelector('ul');
ul.addEventListener('click', function (e) {
var target = e.target；
(function(i){
var cln=i.className?i.className:' ';
if(i.tagName==="LI" &&cln.indexOf('target')>=0){
alert(i.innerHTML);
}
})(target);
}