如何在没有jQuery的情况下获取事件目标

Question

我一直试图<li>从mouseenter事件中获取目标(元素),但到目前为止还没有运气!

代码:

<ul id="ul">
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
</ul>

<script>
    var ul = document.getElementById('ul');

    ul.onmouseenter = function(e) {
        console.log(e.target);
    };
</script>

不幸的是,控制台不断打印<ul />元素.有什么建议？

Answer 1

这是因为onmouseenter事件不是"冒泡"事件,因此它只在您输入UL元素时触发,而不是在您输入嵌套元素(如LI元素)时触发.

因此,e.target和this元素都将是UL.

如果使用onmouseover相反的,它将泡沫,所以你会得到LI作为e.target进入时LI的元素.