抓取全球速卖通：数据属性在检查元素之前不会加载答案

【问题标题】：Scraping AliExpress : Data Attribute doesn't load until Inspect Element抓取全球速卖通：数据属性在检查元素之前不会加载
【发布时间】：2019-07-22 06:55:46
【问题描述】：

我正在尝试在 Aliexpress.com 上抓取有关产品的一些信息

这是我尝试过的示例产品： https://www.aliexpress.com/item/32905045358.html?spm=2114.search0104.3.9.55e81bfaYkNYa0&ws_ab_test=searchweb0_0%2Csearchweb201602_9_10065_10068_319_10546_10059_10884_317_10548_10887_10696_321_322_10084_453_10083_454_10103_10618_10307_537_536%2Csearchweb201603_52%2CppcSwitch_0&algo_expid=b2cb9169-93e1-4d1d-a2a9-01caee37e0b4-1&algo_pvid=b2cb9169-93e1-4d1d-a2a9-01caee37e0b4

我想要什么：从每个变体图像中获取 data-spm-anchor-id 属性。

问题：在我尝试手动检查元素之前它不会加载

页面加载完成后尝试获取属性：

document.querySelector('.sku-property-image').querySelector('img')

结果：

<img src="https://ae01.alicdn.com/kf/HTB1HAk8UgHqK1RjSZFkq6x.WFXaB/Boruto-Naruto-Hoodies-Jacket-Men-3D-Hoodie-Akatsuki-Coat-Uchiha-Itach-Cosplay-Costume-Kakashi-Hoodies-Sweatshirts.jpg_50x50.jpg" title="2">

检查元素以查看 data-spm 是否存在：

然后在控制台上再次运行查询，您将看到：

<img src="https://ae01.alicdn.com/kf/HTB1HAk8UgHqK1RjSZFkq6x.WFXaB/Boruto-Naruto-Hoodies-Jacket-Men-3D-Hoodie-Akatsuki-Coat-Uchiha-Itach-Cosplay-Costume-Kakashi-Hoodies-Sweatshirts.jpg_50x50.jpg" title="2" data-spm-anchor-id="a2g0o.detail.1000016.i1.570f6bf9tarSlz">

data-spm-anchor-id attr 在检查元素后突然出现

我如何通过 puppeteer 或 Cheerio 以编程方式获得这个？

【问题讨论】：

标签： javascript jquery web-scraping puppeteer cheerio

【解决方案1】：

当您单击该图像时，该属性正在加载。所以基本上你需要点击每个图像并获取属性。你可以这样做：

var images = await page.$$(".sku-property-image");
for(let image of images) {
  await image.click();
  //Wait for the attribute to be loaded.
  await page.waitFor(image => image.querySelector("img").getAttribute("data-spm-anchor-id"), {}, image);
  console.log(await page.evaluate(image => image.querySelector("img").getAttribute("data-spm-anchor-id"), image));
}

【讨论】：