Firefox和Safari中的MouseEvent.path等价物

Question

我正在使用Polymer 1.0,当点击Chrome中的按钮时,MouseEvent就会生成一个.此MouseEvent对象具有一个path属性,该属性是单击按钮的父元素的有序数组.但是,在Firefox和Safari中,click会生成一个没有path属性的a .是否有click对象的等效属性给我相同的信息？

Answer 1

它不可用,但是如果你真的想拥有这个属性,那么你可以扩展Event对象的原生原型,如下所示:

if (!("path" in Event.prototype))
Object.defineProperty(Event.prototype, "path", {
  get: function() {
    var path = [];
    var currentElem = this.target;
    while (currentElem) {
      path.push(currentElem);
      currentElem = currentElem.parentElement;
    }
    if (path.indexOf(window) === -1 && path.indexOf(document) === -1)
      path.push(document);
    if (path.indexOf(window) === -1)
      path.push(window);
    return path;
  }
});

但是,如果我是你,我不会扩展原型 - 我会创建一个如上所述的函数.

如果你想只覆盖那些类型的事件,我也会将Event.prototype更改为MouseEvent.prototype.

Answer 2

似乎e.composedPath（）方法可能是的跨浏览器版本e.path。它适用于Chrome和Firefox。不确定Safari。