javascript delegate dom元素

Question

<

div id="parent">


<div id="child"></div>




<

div>


document.querySelector("#parent").addEventListener("click",function(e){
        var target = e.target || e.srcElement;
        if(target.id == "child"){
            //do something;
        }
    })

在上面我们在parent 上监听 click事件，如果来自child，那么就do something，但是如果是下面的情况如何实现

<div id="parent">
    <div id="child">
        <div></div>
    </div>
<div>

我点击child里面那个没有任何id或者class的div, 冒泡到child上，再冒泡到parent上，我也要触发do something。
因为此时e.target 是那个未命名的div，所以不能采取原来的方法，此时怎么做

Answer 1

你总是需要有办法去标识那个 DIV 的，如果唯一的情况，可以

javascriptswitch (target.id) {
    case "child":
        // do something 1
        break;
    case "parent":
        // do something 2
        break;
    default:
        // do something other
}

如果有多个没法标识的DIV……那你还是加个标识来得快些

Answer 2

e.target.parentNode.id == "child"