当我使用 js 操作 DOM 时发生了一些奇怪的事情

Question

你能在 walmart.com 的页面中使用js选择size来实现吗？我已经尝试过几次，但没有效果。像这样：

document.querySelector('.prod-ProductVariantType .chooser-option-current div').click();
document.querySelectorAll('.prod-ProductVariantType div.chooser-option-list div div')[1].click();

执行上述代码后没有任何反应。页面网址：https：//www.walmart.com/ip/NEW-Laptop-Cart-Table-desk-height-Adjustable-Portable-with-rolling-wheels-SPTE/794250587

这个案子就像我在标题中提到的一样。

更新：我犯了一个错误，它应该是size而不是color，对不起 再次为此。

Answer 1

如果你运行这段代码，没有什么奇怪的发生(它将选择其他颜色选项(：

const puppeteer = require('puppeteer');
(async () => {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    await page.goto('https://www.walmart.com/ip/NEW-Laptop-Cart-Table-Desk-Height-Adjustable-Portable-with-Rolling-Wheels-SPTE/794250587');
    await page.click('.prod-ProductVariantSwatch > div > div:nth-child(1) > label > span');
    await page.screenshot({ path: 'image.png' });
    await browser.close();
})();