Question

我正在使用变异观察器从twitch.tv中获取任何聊天消息。

var observer = new MutationObserver(function (mutations) {  
    mutations.forEach(function (mutation) {
        if(mutation.addedNodes[0].classList.contains('chat-line__message')){
            counter++;
            console.log(counter);
        }
    });  
}); 

var observerConfig = {        
    childList: true,
};

它可以正常工作，直到聊天达到大约144的最大消息量然后我一直得到：

Uncaught TypeError: Cannot read property 'classList' of undefined

为什么会这样，我怎么能克服它？

Answer 1

并非每个突变都会添加节点。听起来有些突变只涉及被删除的节点。为避免错误，您可以像往常一样检查是否存在添加的节点：

if(mutation.addedNodes.length && mutation.addedNodes[0].classList.contains('chat-line__message'))

实际上，突变可能会添加多个节点。这是一种更强大的方法：

mutations.forEach((mutation) => {
  const addedChatLineMessages = Array.from(mutation.addedNodes)
    .filter(({classList}) => classList && classList.contains("chat-line__message"))

  if(addedChatLineMessages.length){
    counter += addedChatLineMessages.length;
    console.log(counter);
  }
});

Mutation Observer - addedNodes [0]最终变得未定义

1 个答案: