如何在 puppeteer 中单击 id 包含冒号的元素？

Question

按钮有这样的 id my:very:beautiful:button

<input id="my:very:beautiful:button" type="image" src="https://xxx/search_off.gif" name="my:very:beautiful:button" onmouseout="imgOff('searchBttn', this)" onmouseover="imgOn('searchBttn', this)" class="btn searchBttn" onclick="doSubmit(this, 'clearBttn')">

在 puppeteer 中，我尝试单击此按钮是：

await page.click('#my\:very\:beautiful\:button');

抛出：

Error: Evaluation failed: DOMException: Failed to execute 'querySelector' on 'Document': '#my:very:beautiful:button' is not a valid selector.

使用双转义字符：

await page.click('#my\\:very\\:beautiful\\:button');

抛出：

Error: No node found for selector: #my\:very\:beautiful\:button

我认为问题是冒号。任何想法如何点击它？

Answer 1

“双重转义”有效。冒号应该不是问题。

问题很可能是元素还没有被渲染。要等待元素首先被渲染，你可以使用这样的函数page.waitForSelector：

const selector = '#my\\:very\\:beautiful\\:button';
await page.waitForSelector(selector);
await page.click(selector);

Answer 2

您可以尝试使用属性选择器：

await page.click('[id="my:very:beautiful:button"]');