如何将EventListener添加到所有IMG标签

Question

我有一个ContentEditable Div元素（编辑器）。 我想将EventListener添加到编辑器中的所有图像标签。 我该怎么做。 对于现有图片，我可以使用

var imageNodes = document.getElementsByTagName('IMG');
        for(var i=0;i<imageNodes.length;i++) {          
            imageNodes[i].addEventListener('DOMNodeRemoved',getRemovedNodeDetails,false);
        }

对于新输入的图像，我该怎么做。 我可以向所有IMG标签添加样式，以便每当输入新图像时，侦听器都将添加到标签中。

Answer 1

您可以使用事件委托在父节点上添加事件侦听器，而不是在每个img标签上添加事件侦听器。 这样可以提供更好的性能，更重要的是，您可以自然地以这种方式处理新添加的图像。

Answer 2

张贴此消息不是因为wong的答案是错误的，而是太简短了。

// Warning: Typed on the fly

document.body.addEventListener('DOMNodeRemoved',getRemovedNodeDetails,false);

function getRemovedNodeDetails(e) {
  e = e || window.event;
  var target = e.target || e.srcElement;

  // Yea, there are times tagName returns a lowercase value.
  // I always normalize it for my own sanity.
  if (target.tagName.toUpperCase() === "IMG") {
    // Now, do something with target
  }
}

更多详细信息： http : //www.sitepoint.com/javascript-event-delegation-is-easier-than-you-think/