替换页面加载后由脚本动态添加的dom内容，然后呈现它

Question

比方说，有一个带有脚本的页面，该页面以随机的时间间隔将新图像追加到主体，我想在这些图像被chrome渲染之前交换这些图像。下面的代码可以执行此操作，但是在初始图像已经渲染之后：

function swap(node) {
  var elements = document.getElementsByTagName("img-shadow");
  Array.prototype.forEach.call(elements, function(element) {
      var img = element.querySelector('img#img');
      if (img && img !== null && img.width === 512) {
          img.src = "some url";
      }
  });
}

var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
      if (!mutation.addedNodes) return
      for (var i = 0; i < mutation.addedNodes.length; i++) {
          var node = mutation.addedNodes[i]
          swap(node);
      }
  })
});

observer.observe(document.body, {
  childList: true,
  subtree: true,
  attributes: true,
  characterData: false
})