ホームページ  >  記事  >  ウェブフロントエンド  >  Puppeteer と XPath を使用してテキスト コンテンツに基づいて要素をクリックする方法

Puppeteer と XPath を使用してテキスト コンテンツに基づいて要素をクリックする方法

Susan Sarandon
Susan Sarandonオリジナル
2024-10-28 16:30:02852ブラウズ

How to Click Elements Based on Text Content Using Puppeteer and XPath?

Puppeteer でテキストで要素をクリックする

Puppeteer では、XPath 式を使用してテキストの内容に基づいて特定の要素をクリックすることができます。

テキストを含む要素をクリックする方法

特定のテキストを含む要素をクリックするには、次の XPath 式を使用します:

const [element] = await page.$x("//element[contains(., 'text')]");
await element.click();

Replace "element" " には適切なタグ名 (例: "button" や "a") を指定し、"text" には一致する必要な部分文字列を指定します。例:

//button[contains(., 'Button text')]

考慮事項

  • 要素に正確なテキスト文字列が含まれていることを確認してください。
  • 要素がネストされている場合特定のコンテナの場合は、追加の「/」を使用して、目的の祖先要素を選択します。たとえば、div 内のボタンをクリックするには:
//div[@class='container']/button[contains(., 'Button text')]

XPath vs. Text()

XPath 式には (., ' Text') は、要素の子ノードを使用して、指定されたテキストと一致します。対照的に、contains(text(), 'Text') は要素のテキスト コンテンツのみを考慮します。

次の HTML があるとします:

<div class="elements">
    <button>Button text</button>
    <a href="#">Href text</a>
    <div>Div text</div>
</div>

ボタンをクリックするには、次を使用します:

const [button] = await page.$x("//div[@class='elements']/button[contains(., 'Button text')]");
await button.click();

以上がPuppeteer と XPath を使用してテキスト コンテンツに基づいて要素をクリックする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。