写js ,监控某个html标签,如果其包含的标签发生变化,发生改变就立即获取内容
时间: 2023-10-06 21:09:09 浏览: 36
可以使用 MutationObserver 监听目标元素的子元素变化,代码如下:
```javascript
// 获取目标元素
const target = document.querySelector('#target');
// 创建 MutationObserver 实例
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
// 判断是否是子元素发生变化
if (mutation.type === 'childList') {
// 获取目标元素的内容
const content = target.textContent;
console.log(content);
}
});
});
// 配置 MutationObserver
const config = { childList: true };
// 开始监听目标元素的变化
observer.observe(target, config);
```
在上面的代码中,我们首先使用 `document.querySelector` 获取了目标元素。然后创建了一个 `MutationObserver` 实例,并指定了回调函数,回调函数中会遍历所有的变化记录,检查是否是子元素发生了变化,如果是,则获取目标元素的文本内容,并将其输出到控制台。
最后,我们需要调用 `observer.observe` 方法,开始监听目标元素的变化。该方法接受两个参数,第一个参数是要监听的目标元素,第二个参数是一个配置对象,我们在这里指定了 `childList: true`,表示我们要监听目标元素的子元素变化。