[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); }