再试一下使用这个 cheerio 加载器，加载一个需要运行 JavaScript 才能生成内容的页面，地址是 https://nid-vue.ninghao.co/posts/25 。在终端，运行一下应用。你会发现，得到的这个文档内容并不是真正在网页上显示的内容。这是因为 cheerio 只能抓取静态网页的内容。

可以在浏览器访问一下这个网页观察一下，这个 Web 应用是我们在宁皓网的独立开发者训练营里一起做的一个实例项目。如果大家想学一下，可以报名参加宁皓网的独立开发者训练营。

查看一下这个网页的源代码，你会发现，在页面源代码这里并没有在网页上显示的内容。因为这是一个使用 Vue 框架做的前端应用。如果想要抓取这种需要运行 JavaScript 代码才能显示内容的页面，就需要使用一些其它的技术，比如 Puppeteer。你也可以使用这个工具模拟真人与网页交互时的一些行为，比如点击了某个按钮，在表单里输入内容等等。

先给项目安装一个包，在终端，项目所在目录的下面，执行 npm install 要安装的是 puppeteer。完成以后回到项目，在这个 Node.js 程序文件的顶部，先导入 PuppeteerWebBaseLoader，它来自 langchain/document_loaders/web/puppeteer。

下面可以创建一个 loader，声明一个 puppeteerWebBaseLoader，它的值可以新建一个 PuppeteerWebBaseLoader，给它提供一个网址，比如 https://nid-vue.ninghao.co/posts/25 。

然后再声明一个 documents ，等于 await，用一下 puppeteerWebBaseLoader 上面的 load() 这个方法，在控制台再输出这个 documents。

回到终端，执行一下 node index.mjs，这回就成功创建了一个 document，这个文档的内容就是一个渲染之后的网页的源代码。

选项

如果只需要这个网页上的某一部分内容，在创建这个 PuppeteerWebBaseLoader 的时候，可以设置一下它的选项参数。一个对象，里面添加一个方法，名字是 evaluate，它有两个参数，一个 page，一个 browser。这里我们只需要用到 page 这个参数。

在这个方法里，声明一个 contentElement，等于 await，用一下 page.$ 这个方法，给它提供一个选择器，比如 .post-show-content，在这个类的元素里包装的东西就是贴子的内容。

下面声明一个 content，表示内容，等于 await，用一下 page.evaluate 这个方法，提供一个回调，有个 element，返回的东西是这个 element 里的 textContent。第二个参数是上面得到的这个 contentElement。

最后让 evaluate 方法返回这个 content ，它的值就是网页上的贴子内容。

在终端，再运行一下应用，这回加载网页以后创建的这个文档的内容，就是网页上的贴子内容。