通过选择器获取动态元素

Typ*_*oon 5 html javascript dom node.js puppeteer

我需要点击与某个网页按钮id:#product-6852370-Size.

我正和Puppeteer一起工作,所以通常我会这样做:

page.click('#product-6852370-Size');
Run Code Online (Sandbox Code Playgroud)

棘手的部分是数字6852370是动态的,每次刷新页面时都会改变.

所以我需要的是一段代码:

搜索id包含product-和的-size.这可能发生什么?

Gra*_*ler 11

您可以使用以下方法匹配id属性的开头和结尾:

await page.click('[id^="product-"][id$="-Size"]');
Run Code Online (Sandbox Code Playgroud)

或者,更准确地说,您可以确保在id使用正则表达式的中间存在一个数字:

await page.evaluate(() => {
  [...document.querySelectorAll('[id^="product-"][id$="-Size"]')].filter(e => e.id.match(/^product-\d+-Size$/g))[0].click();
});
Run Code Online (Sandbox Code Playgroud)