如何将mutationobserver注入puppeteer

本文介绍了如何将mutationobserver注入puppeteer的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我想要像无头 chrome 中的 mutationobserver 一样跟踪更改的 DOM.所以我在学习 puppeteer 库，但不知道如何使用.

I want trace changed DOM like mutationobserver in headless chrome.So I learning puppeteer library, but don’t know how to use do that.

可以在 puppeteer 中跟踪 DOM 变化吗??谢谢

It’s possible to trace DOM change in puppeteer?? thanks

推荐答案

好吧，你可以向浏览器注入自定义代码.

Well,you can inject custom code to the browser.

一种方式:

await page.evaluate(() => {
   const observer = new MutationObserver(
   function() {
     // communicate with node through console.log method
     console.log('__mutation')
    }
   )
   const config = {
     attributes: true,
     childList: true,
     characterData: true,
     subtree: true
   }
   observer.observe(target, config)
})

在您的节点脚本中:

page.on('console', async (msg) => {
   if (msg.text === '__mutation') {
     // do something...
   }
})

这篇关于如何将mutationobserver注入puppeteer的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

Chrome