突变观察者导致无限循环

时间:2019-07-03 13:08:58

标签: javascript dom mutation-observers

我正在尝试修改使用React并通过API拍摄图像并使用Mutation Observer生成图库的网站的图像,但已导致无限循环错误。我用这段代码得到的结果是:

结果

herehttp://www.image.com/image.jpg
hereherehttp://www.image.com/image.jpg
herehereherehttp://www.image.com/image.jpg
hereherehereherehttp://www.image.com/image.jpg
herehereherehereherehttp://www.image.com/image.jpg
hereherehereherehereherehttp://www.image.com/image.jpg
herehereherehereherehereherehttp://www.image.com/image.jpg

代码

document.addEventListener('DOMContentLoaded',function(){

const muta = document.querySelector("#root");
const observer = new MutationObserver(function(mutations) {

           mutations.forEach(function (mutation) {

                mutation.addedNodes.forEach(function (node) {

                    if (typeof node.getElementsByTagName !== 'function') {
                        return;
                  }

                  let section = document.getElementsByTagName('section')[0];
                  let images = section.getElementsByTagName('img');

                  Array.from(images).forEach(function(image){
                    let newimg =  'here'+image.src;
                    if(image.src !== newimg){

                      image.src = newimg;
                    }

                  });


            });

         });       

});

var observerConfig = {
  attributes: true,
  childList: true,
  attributeOldValue: true,
  characterData: true,
  subtree: true
}
observer.observe(muta, observerConfig);
});

0 个答案:

没有答案