使用 Puppeteer 检查元素是否被禁用

我有一个按钮，其初始状态为disabled -

<button type = "submit" class="ant-btn ant-btn-primary ant-btn-lg" disabled>

The disabled一旦满足条件，属性就不存在 - 因此 HTML 变为

<button type = "submit" class="ant-btn ant-btn-primary ant-btn-lg">

我想检查按钮是否有属性disabled，但是由于该属性没有值，我无法找到这样做的方法。

例如，如果disabled属性有这样的东西

<button type = "submit" class="ant-btn ant-btn-primary ant-btn-lg" disabled = "disabled">

那么我可以做这样的事情

let button = await page.$('button');
let valueHandle = await input.getProperty('disabled');
assert.equal(await valueHandle.jsonValue(), 'disabled');

但由于该属性没有值，在这种情况下如何进行？

这是一个全面的解决方案，展示了如何使用以下方法解决您的问题：

page.$() https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pageselector, page.$$() https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pageselector-1, page.$eval() https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pageevalselector-pagefunction-args-1, page.$$eval() https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pageevalselector-pagefunction-args, page.$x() https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pagexexpression, and page.evaluate() https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pageevaluatepagefunction-args.

// Using page.$()
const is_disabled = await page.$('button[disabled]') !== null;

// Using page.$$()
const is_disabled = (await page.$$('button[disabled]')).length !== 0;

// Using page.$eval()
const is_disabled = await page.$eval('button[disabled]', button => button !== null).catch(error => error.toString() !== 'Error: Error: failed to find element matching selector "button[disabled]"');

// Using page.$$eval()
const is_disabled = await page.$$eval('button[disabled]', buttons => buttons.length !== 0);

// Using page.$x()
const is_disabled = (await page.$x('//button[@disabled]')).length !== 0;

// Using page.evaluate()
const is_disabled = await page.evaluate(() => document.querySelector('button[disabled]') !== null);