javascript - 如何使用 querySelector 获取最后一个元素？

Question

我正在从一个有很多嵌套 HTML 元素的网站上抓取信息，但我感兴趣的是 abbr元素。在我的例子中那些 abbr元素有data-utime属性，因此它们被定义为 <abbr data-utime="someValue">some other nested HTML</abbr> .所以，我想做的是我想得到 data-utime最后一个的属性值 abbr页面上的元素。

我试着做这样的事情:

const SELECTOR = 'abbr:last-child';
const result = await page.evaluate((selector) => {
  return document.querySelector(selector);
}, SELECTOR);

console.log(result);
console.log(typeof(res));
console.log(result.getAttribute('data-utime'));

但问题是在我得到的输出中，result只是一个空对象( {} )，所以 typeof(res)返回对象，它当然没有 getAttribute然后功能。我也相信last-child选择器是获取最后一个 abbr 的正确方法页面上的元素。有什么想法可以实现我想要的吗？

Answer 1

evaluate 在页面上下文中运行；结果被序列化并返回。使用 $$eval 代替:

const SELECTOR = "abbr";
const result =
      await page.$$eval(SELECTOR,
                        (elements) => elements[elements.length - 1].dataset.utime);
console.log(result);

您还可以使用 evaluate 并在其中调用 document.querySelectorAll，但我更喜欢将选择器保留在我的 Puppeteer 代码中，以便我可以重用它们。