JavaScript 网页抓取：2026年完整指南

制作 JavaScript 中的网络搜刮, 你需要 Node.js 以及适合你目标受众的书库。请使用 Cheerio 对于静态页面和 Puppeteer 在哪里 Playwright 一旦内容在客户端渲染完成。.

本指南将一步步教你如何安装、编写代码并运行你的第一个网页爬虫。.

使用 JavaScript 进行网络搜刮的先决条件

用于在 JavaScript 中进行网页抓取的 Node.js 运行环境及库。. — 用于在 JavaScript 中进行网页抓取的 Node.js 环境和库 ©Christina 供 Alucare.fr 使用

在编写你的第一个JS脚本之前，只需掌握两个基础工具就能开始了。.

Node.js ：一个 JavaScript 运行环境开源且支持多平台。它允许你直接在控制台中运行JS代码，而无需通过浏览器。请从Node.js的官方文档中下载它。.
npm (Node Package Manager) ：内置于 Node. 它可用于通过一条简单的命令安装你的库 npm install.

一次 Node.js 安装完成后，你可以根据要抓取的网页类型选择相应的库。以下是最常用的库。.

Cheerio : 非常适合…… 静态页面抓取. 它采用一种类似于 jQuery。她是 轻便、快速 且简单，但不会执行页面中的 JavaScript 代码。请参阅 Cheerio 文档。.
Puppeteer 和 Playwright ：非常适合 动态网站. 它们驱动一个真正的无头浏览器（Chrome 在哪里 Firefox)，并像真实用户一样加载页面。请参阅 Puppeteer 文档。.

规则很简单： Cheerio 对于静态页面，, Puppeteer 在哪里 Playwright 一旦网站通过JavaScript加载数据。.

如何使用 JavaScript 进行网络搜刮？

原理很简单：你获取 HTML 对于一个网页，你先锁定感兴趣的元素，然后提取数据。工具的选择仅基于一个标准：该页面是否天电在哪里 动态的 ?

步骤 1：安装和配置

首先下载 Node.js 从官方网站下载，然后安装它。接着在终端中检查安装情况：

node -v
npm -v

如果两个版本都显示出来，说明一切正常。现在开始创建你的项目：

mkdir my-scraping
cd my-scraping
npm init -y

该命令会生成一个文件 package.json 该命令将列出你的依赖项。接下来只需安装符合你需求的库即可。.

对于一个 静态页面 （该内容已包含在服务器返回的HTML中），请使用 axios 和 Cheerio :

npm install axios cheerio

对于一个 动态页面 （通过客户端 JavaScript 加载的数据，例如 React, Vue 在哪里 Angular)，请改安装 Puppeteer :

npm install puppeteer

步骤 2：创建搜索脚本

在编写 JS 脚本之前，先确定正确的 CSS 选择器. 在 Chrome 在哪里 Firefox, ，右键单击目标元素，然后选择«检查»。此时将显示DOM：这样你就能找到标签、类（.类) 或用户名 (#id) 作为目标。.

使用……抓取静态页面 Cheerio

Cheerio 仅读取 普通 HTML 且不会执行任何JS脚本。在采用客户端渲染的网站上，用户只会看到一个空白页面。.

// 导入库
const axios = require('axios')；
const cheerio = require('cheerio')；

// 要废止的页面的 URL
const url = "https://exemple.com"；

// 主函数
async function scrapePage() {
  try {
    // 下载 HTML 内容
    const { data } = await axios.get(url)；

    // 使用 cheerio 加载 HTML
    const $ = cheerio.load(data)；

    // 示例：检索所有 h1 标题
    const titles = []；
    $("h1").each((i, elem) => {
      titles.push($(elem).text().trim())；
    });

    // 显示结果
    console.log("Titles found:", titles)；

  } catch (error) {
    console.log("Error while scraping:", error)；
  }
}

// 运行脚本
scrapePage()；

替换 https://exemple.com 通过你选择的URL，然后调整选择器 $("h1") 以便锁定你感兴趣的内容： $("p") 对于段落，, .类 在哪里 #id 针对特定元素。该方法 .text() 返回 textContent 该元素的，相当于 jQuery 服务器端。.

使用……抓取动态页面 Puppeteer

Puppeteer 真正的飞行员 无头浏览器 并等待 JavaScript 加载完内容，即在 Cheerio 失败了。.

// 导入 Puppeteer
const puppeteer = require("puppeteer")；

// 要清除的页面的 URL
const url = "https://exemple.com"；

async function scrapePage() {
  // 启动无图形界面（无头）浏览器
  const browser = await puppeteer.launch({ headless: true })；
  const page = await browser.newPage()；

  try {
    // 转到页面
    await page.goto(url, { waitUntil: "networkidle2" })；

    // 示例：从所有 h1 标题中提取文本
    const titles = await page.$$eval("h1", elements =>)
      elements.map(el => el.textContent.trim())
    );

    console.log("Titles found:", titles)；

  } catch (error) {
    console.error("Error while scraping:", error)；
  } finally {
    // 关闭浏览器
    await browser.close()；
  }
}

// 运行脚本
scrapePage()；

选项 waitUntil: "networkidle2" 等待……结束 网络请求 在从网页中提取数据之前。.

第 3 阶段：管理提取的数据

数据恢复完成后，你可以将其保存到 JSON 用于数据库，或作为 CSV 以便在Excel中打开它们。该模块 FS 是……人 Node.js 且无需任何安装。对于 CSV，只需添加该库 json2csv :

npm install json2csv

const axios = require("axios");
const cheerio = require("cheerio");
const fs = require("fs");
const { Parser } = require("json2csv");

const url = "https://exemple.com";

async function scrapeAndSave() {
  try {
    // Récupérer le HTML de la page
    const { data } = await axios.get(url);
    const $ = cheerio.load(data);

    // Extraire les titres dans un tableau d'objets
    const resultats = [];
    $("h1").each((i, elem) => {
      resultats.push({ titre: $(elem).text().trim() });
    });

    // Sauvegarde en JSON
    fs.writeFileSync("resultats.json", JSON.stringify(resultats, null, 2), "utf-8");
    console.log("Données sauvegardées dans resultats.json");

    // Sauvegarde en CSV
    const parser = new Parser();
    const csv = parser.parse(resultats);
    fs.writeFileSync("resultats.csv", csv, "utf-8");
    console.log("Données sauvegardées dans resultats.csv");

  } catch (error) {
    console.error("Erreur lors du scraping :", error);
  }
}

scrapeAndSave();

这个JS脚本一气呵成地完成了所有操作：它加载网页，提取HTML数据，然后写入 两个文件. 该模块 try / catch 处理错误，以防止出现暂停或一个 验证码 导致整个爬虫脚本崩溃。.

使用 JavaScript 进行网络搜刮的最佳实践

在运行脚本之前，养成几个简单的习惯，可以确保你的JS爬虫正常运行 高效、稳定 并遵守相关网站的使用条款。同样重要的是，你要确保你的该做法是合法的视具体情况而定。.

尊重 robots.txt 文件 ：这是黄金法则。在抓取网页之前，请先打开 https://exemple.com/robots.txt. 如果目标路径位于禁止, ，不要抓取该内容。这样可以避免引发道德和法律问题。.
请间隔一段时间再提交请求 : 请勿频繁访问该网站。在每次访问之间留出间隔，以保持低调并避免被封禁。.
自定义你的User-Agent ：默认情况下，JS爬虫很容易被发现。使用 Puppeteer, ，通过以下方式定义一个符合实际的标题： page.setUserAgent() 以模拟真实的浏览器。.
处理错误和卡顿 : 将你的调用包裹在一个代码块中 try / catch 以防止因超时或验证码导致整个脚本崩溃。.

应考虑哪些替代方案？

网络爬虫技术并不局限于JavaScript。根据你的项目情况，其他编程语言或工具可能更能满足你的需求。.

Python ：图书馆 Scrapy 和 BeautifulSoup 在提取大量网页内容方面效果显著。.
PHP : 如果你想将爬虫功能直接集成到用该语言编写的现有网站中，这会很方便。.
无需编码的工具 例如Bright Data、Octoparse和Apify：它们能让你无需编写任何代码即可抓取网页数据。.

爬虫API还是DIY方案：该如何选择？

真正的问题不在于编程语言，而在于你自己愿意处理多复杂的任务。你自己的爬虫脚本使用 Puppeteer 在哪里 Cheerio 当流量较小且网站防护不足时，这仍是最佳选择。.

A 扫描应用程序接口（例如Bright Data提供的方案）一旦你面临高级封锁措施，其重要性便会凸显：IP地址轮换、自动破解验证码、大规模JavaScript渲染。.

简而言之：该 DIY 既能帮你省钱，又能让你学到很多东西。这个’应用程序接口 能帮你节省处理繁重或重复性项目的时间。.

常见问题

什么是最好的 JavaScript 网络搜索工具？

这完全取决于你想抓取的是什么类型的网页。.

Cheerio ：轻便快捷，非常适合 分析HTML 静态页面。.
Puppeteer : 非常适合操控真正的浏览器 Chrome 并管理通过 JavaScript 生成的内容。.
Playwright : 靠近 Puppeteer, ，但带有 多浏览器支持 (Chrome, Firefox, WebKit）以及其他高级功能。.