NodeJS - 解析 HTML 并多次查找某些字符串

Question

我正在使用 puppeteer 加载网站，然后使用以下方式存储该网站的 HTML：

html = await page.evaluate('new XMLSerializer().serializeToString(document.doctype) + document.documentElement.outerHTML');

这很好用，returns html 就像它应该做的那样（长话短说不能在这个网站上使用请求）。

我现在需要做的是在 HTML 中有一个看起来像这样的块：

<ul class="styled-radio">
<li>
<input type="radio" name="variant_id" id="variant_id_118018" value="118018">
<label for="variant_id_118018">5</label>
</li>
<li>
<input type="radio" name="variant_id" id="variant_id_118019" value="118019">
<label for="variant_id_118019">6</label>
</li>
<li>
<input type="radio" name="variant_id" id="variant_id_118020" value="118020">
<label for="variant_id_118020">6,5</label>
</li>
... keeps going ...
</ul>

对于每个 variant_id_xxxxxx 我需要获取 xxxxxx 数值以及标签内部文本，然后将其存储为 xxxxxx:innerTextHere

例如，对于上面那段文本中的第一个，它将是 118018:5

如果我们可以将所有 xxxxxx:innerTextHere 值存储在数组 sizes 中，那也很好，所以上面 html 的最终结果将是是 [118018:5, 118019:6, 118020:6,5]

提前致谢:)

Answer 1

您可以使用节点包 Cherrio 来实现上述结果。请参考示例代码。

const cheerio = require('cheerio')

const data = `
<ul class="styled-radio">
<li>
<input type="radio" name="variant_id" id="variant_id_118018" value="118018">
<label for="variant_id_118018">5</label>
</li>
<li>
<input type="radio" name="variant_id" id="variant_id_118019" value="118019">
<label for="variant_id_118019">6</label>
</li>
<li>
<input type="radio" name="variant_id" id="variant_id_118020" value="118020">
<label for="variant_id_118020">6,5</label>
</li>
... keeps going ...
</ul>`;

const result = [];

const $ = cheerio.load(data);

const variants = $("input[name='variant_id']");

variants.each((index, { attribs }) => {
    const { id, value } = attribs;
    const label = $("label[for='" + id + "']");
    result.push({
        id,
        value,
        label: label.text()
    })
})


console.log(result);

NodeJS - 解析 HTML 并多次查找某些字符串

NodeJS - Parse HTML and find certain strings multiple times

javascript

html-parsing

node.js