为什么此mouseenter事件在<a> tag

Question

I would like to know why this mouseenter event is never get call. Change the parent to ul tag and everything works

I set up an jsfiddle here http://jsfiddle.net/4vfqgz7x/1/

内的标记上不起作用

Answer 1

问题在于，您不能在{strong>另一个a元素的内居住一个a元素。

<a>
  <li class="complete">1</li>
  <li class="complete">2</li>
  <a>3</a>
  <i>4</i>
</a>

如果运行并检查以上代码片段，您将看到DOM中的结果实际上是：

<a>
    <li class="complete">1</li>
    <li class="complete">2</li>
</a>
<a>3</a>
<i>4</i>

因此，您的a > i的CSS选择器（全选 i 其中父项为 a 的元素元素）将无法正常工作。

---

参考：What elements can be contained within a <a> tag?