JavaScript大佬帮忙看下 Mutation Observer 问题

[ico]

我写了个测试 Mutation Observer 的脚本，在 Seeking Alpha 网站上运行，监听新闻列表最下面翻页的变化，为啥只有第一次加载页面时才能看到 mutation 产生的 log 呢？
测试页面： Apple Inc. (AAPL) Latest Stock News (seekingalpha.com)

// ==UserScript==
// @name         test mutation observer
// @namespace    http://tampermonkey.net/
// @version      2024-01-28
// @description  try to take over the world!
// @author       You
// @match        https://seekingalpha.com/symbol/*/news*
// @icon         https://seekingalpha.com/samw/static/images/apple-touch-icon.png
// @grant        window.onurlchange
// ==/UserScript==

const observer = new MutationObserver(()=>{console.log('mutated 啦啦啦')});
const node = document.querySelector('div[data-test-id="pagination"]');
const config = {subtree: true, childList: true, attributes: true, characterData: true};
observer.observe(node, config);

[Xianmin_Chen]

一个可能的原因是在翻页后，你定义的 const node 被删除了，不是原先 observe 的 node 了。

[tempUserName]

帮你验过了，就是上面老兄讲的那样

[ico]

谢谢你和@tempUserName 解答，原来如此
那有什么办法监视这种会被短暂删掉的元素吗？只能用setInterval？感觉setInterval的方式不太好啊

[runze]

往上找父元素呀

[ico]

其实我是想对上边的新闻列表做一些操作，比如想要实现每次一翻页就给上边的新闻加数字序号
但是监控翻页导航的父元素的话，因为父元素也包含了新闻列表，给新闻加序号又会再触发Mutation Observer。所以不知道有没有更优雅的方式，难道就只能设个全局变量存储是否加过序号，每次observer触发后都跟这个全局变量比一遍，看看用不用加序号？这样是不是太不优雅了

[hzhbest]

既然要处理“新闻列表”，就在处理过的新闻列表中加一些标记，如添加一个Classname，或者加个data标志，然后就监控新闻列表的父元素，当父元素变动，就遍历其下面的“新闻列表”，看谁没标记就处理谁。处理之前用
observer.disconnect();
断开observer，处理完后再
observer.observe(.....);
就是了。