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

发布这个，不是因为王的答案是错的，只是有点过于简短......

// 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/

Answer 2

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

如何将AddEistener添加到所有IMG标记

2 个答案: