在运行了以下内容之后,我很难理解如何阅读Cheerio的回复:

const axios = require('axios')
const cheerio = require('cheerio')
axios.get('https://bulbapedia.bulbagarden.net/wiki/Galar_Route_5')
    .then(({data}) => {
        const $ = cheerio.load(data)

        const tableData = $('table:first').after('span#Hidden_encounters')
        console.log(tableData)
    })

当我运行上面的代码时,我得到了一个相当长的响应:

LoadedCheerio {
  '0': <ref *1> Element {
    parent: Element {
      parent: [Element],
      prev: null,
      next: [Text],
      startIndex: null,
      endIndex: null,
      children: [Array],
      name: 'div',
      attribs: [Object: null prototype],
      type: 'tag',
      namespace: 'http://www.w3.org/1999/xhtml',
      'x-attribsNamespace': [Object: null prototype],
      'x-attribsPrefix': [Object: null prototype]
    },
    prev: null,
    next: Text {
      parent: [Element],
      prev: [Circular *1],
      next: [Text],
      startIndex: null,
      endIndex: null,
      data: 'span#Hidden_encounters',
      type: 'text'
    },
    startIndex: null,
    endIndex: null,
    children: [ [Text], [Element] ],
    name: 'table',
    attribs: [Object: null prototype] {
      class: 'roundy',
      style: 'background: #75C977; width: 30%; max-width: 30%; margin-left: 5px; margin-bottom: 5px; border: 3px solid #4AA14D; float:right; text-align:center'
    },
    type: 'tag',
    namespace: 'http://www.w3.org/1999/xhtml',
    'x-attribsNamespace': [Object: null prototype] { class: undefined, style: undefined },
    'x-attribsPrefix': [Object: null prototype] { class: undefined, style: undefined }
  },
  length: 1,
  options: { xml: false, decodeEntities: true },
  _root: <ref *2> LoadedCheerio {
    '0': Document {
      parent: null,
      prev: null,
      next: null,
      startIndex: null,
      endIndex: null,
      children: [Array],
      type: 'root',
      'x-mode': 'no-quirks'
    },
    length: 1,
    options: { xml: false, decodeEntities: true },
    _root: [Circular *2]
  },
  prevObject: <ref *3> LoadedCheerio {
    '0': Document {
      parent: null,
      prev: null,
      next: null,
      startIndex: null,
      endIndex: null,
      children: [Array],
      type: 'root',
      'x-mode': 'no-quirks'
    },
    length: 1,
    options: { xml: false, decodeEntities: true },
    _root: [Circular *3]
  }
}

我通读了the docs遍,他们似乎没有任何关于如何阅读或解释回应的内容.

我在其他地方搜索过(youtube,这里,duckduckgo),但我没有找到任何资源,真正告诉你如何解释回答.

推荐答案

你看到的是一个Cheerio node 对象[1],而不是HTTP响应.你不一定需要能够read它本身,虽然有一些有用的信息可见.只需调用Cheerio API中的函数,例如.text().find()..map()等,操作对象并从中提取数据.最终,我们的 idea 是将Cheerio node 树处理成一些vanilla JS数据 struct 或原始值.

对于这个例子,虽然您没有分享您的目标或期望的输出,但我认为您或多或少需要以下表格数据:

const axios = require("axios"); // ^1.6.8
const cheerio = require("cheerio"); // ^1.0.0-rc.12

axios
  .get("<Your URL>")
  .then(({data}) => {
    const $ = cheerio.load(data);
    const [headers, ...tableData] = [
      ...$("#Hidden_encounters")
        .closest("h1, h2, h3, h4, h5, h6")
        .next("table")
        .find("tr"),
    ]
      .map(e =>
        [...$(e).find("th, td")].map(e => $(e).text().trim())
      )
      .filter(e => e.length > 1);
    console.log(headers);
    console.table(tableData);
  });
[ 'Pokémon', 'Games', 'Location', 'Levels', 'Rate' ]
┌─────────┬────────────┬──────┬──────┬──────────────┬─────────┬────────┐
│ (index) │ 0          │ 1    │ 2    │ 3            │ 4       │ 5      │
├─────────┼────────────┼──────┼──────┼──────────────┼─────────┼────────┤
│ 0       │ 'Lombre'   │ 'Sw' │ 'Sh' │ 'Grass'      │ '16-18' │ '20%'  │
│ 1       │ 'Nuzleaf'  │ 'Sw' │ 'Sh' │ 'Grass'      │ '16-18' │ '20%'  │
│ 2       │ 'Nincada'  │ 'Sw' │ 'Sh' │ 'Grass'      │ '16-18' │ '5%'   │
│ 3       │ 'Espurr'   │ 'Sw' │ 'Sh' │ 'Grass'      │ '16-18' │ '20%'  │
│ 4       │ 'Spritzee' │ 'Sw' │ 'Sh' │ 'Grass'      │ '16-18' │ '14%'  │
│ 5       │ 'Swirlix'  │ 'Sw' │ 'Sh' │ 'Grass'      │ '16-18' │ '14%'  │
│ 6       │ 'Dewpider' │ 'Sw' │ 'Sh' │ 'Grass'      │ '16-18' │ '5%'   │
│ 7       │ 'Dottler'  │ 'Sw' │ 'Sh' │ 'Grass'      │ '16-18' │ '26%'  │
│ 8       │ 'Applin'   │ 'Sw' │ 'Sh' │ 'Grass'      │ '16-18' │ '10%'  │
│ 9       │ 'Skwovet'  │ 'Sw' │ 'Sh' │ 'Berry tree' │ '16-18' │ '100%' │
│ 10      │ 'Goldeen'  │ 'Sw' │ 'Sh' │ 'Fishing'    │ '16-18' │ '10%'  │
│ 11      │ 'Magikarp' │ 'Sw' │ 'Sh' │ 'Fishing'    │ '16-18' │ '70%'  │
│ 12      │ 'Chewtle'  │ 'Sw' │ 'Sh' │ 'Fishing'    │ '16-18' │ '20%'  │
└─────────┴────────────┴──────┴──────┴──────────────┴─────────┴────────┘

可以做更多的工作来组合两个'游戏'单元为一个,但这至少让你开始和处理Cheerio部分.

在使用Cheerio抓取表上存在许多其他线程.看一下下面的答案应该可以澄清两步模式:刮取行,然后用嵌套的.map个调用单元格,如上所示:

[1]:从这个与您的问题Understanding Cheerio object and get attributes类似的问题来看,这实际上是一个parse5 node 对象(除非Cheerio内部 struct 或API自2020年以来发生了变化,或者链接的答案不准确--我还没有进行验证).不过,最终,我建议asking about your fundamental problem种如何提取数据--确切的对象类型可能并不重要,除非它是某种Cheerio node .

Javascript相关问答推荐

React Native平面列表自动滚动

Next.js Next/Image图像隐含性有任何类型-如何修复?

在分区内迭代分区

D3多线图显示1线而不是3线

if/else JavaScript中的条件行为

Angular 17—每当一个布尔变量变为真时触发循环轮询,只要它保持为真

WebGL 2.0无符号整数输入变量

material UI按钮组样式props 不反射

Eval vs函数()返回语义

使用getBorbingClientRect()更改绝对元素位置

Webpack在导入前混淆文件名

面对代码中的错误作为前端与后端的集成

如何在Java脚本中对列表中的特定元素进行排序?

如何使用<;Link>;执行与JS Reaction中的";window.Location=/GameOverDied;";类似的操作?

如何在脚本编译后直接将RxJ模块导入浏览器(无需Angel、webpack、LiteServer)

bootstrap S JS赢得了REACT中的函数/加载

更改管线时不渲染组件的react

material UI自动完成全宽

无法向甜甜圈图表上的ChartJSImage添加可见标签

MUI-TABLE:MUI表组件中交替行的不同 colored颜色 不起作用