在JavaScript事件中替换/覆盖/覆盖e.target

有一个问题，你能在不克隆到新对象的情况下替换e.target吗

小提琴的听众在下面重复

one.addEventListener('click', function(e) {
  // default behaviour, don't modify the event at all
  logTarget(e);
});

two.addEventListener('click', function(e) {
  // replace the value on the same object, which seems to be read-only
  e.target = document.createElement('p');
  logTarget(e);
});

three.addEventListener('click', function(e) {
  function F(target) { 
    // set another property of the same name on an instance object
    // which sits in front of our event
    this.target = target;
  }
  // put the original object behind it on the prototype
  F.prototype = e;
  logTarget(new F(document.createElement('p')));
});

four.addEventListener('click', function(e) {
  // create a new object with the event behind it on the prototype and
  // our new value on the instance
  logTarget(Object.create(e, {
    target: document.createElement('p')
  }));
});

我已经更新了fiddle（），正如您所说，event.target是只读的，但是我们可以用

Object.create

覆盖属性描述符

您的方法是正确的，但是

对象。create

不仅接收

key:value

hashmap，还接收

key:property descriptor

您可以看到属性描述符是如何工作的

我换了

Object.create(e, {
    target: document.createElement('p')
});

与

---

这将原型化

e

并修改新对象的

target

属性。

在Chrome 51中不起作用。除了新事件对象的目标之外的所有属性都已读取

[异常：TypeError:MouseEvent.remoteFunction（：3:14）上的非法调用]

有关正确的解决方案，请参阅。

Object.create(e, {
    target: {
        value: document.createElement('p')
    }
});