ホームページ >ウェブフロントエンド >jsチュートリアル >Puppeteer を使用してテキスト コンテンツに基づいて要素をクリックする方法
Puppeteer を使用してテキストを含む要素をクリックする
課題: テキストのみに基づいて要素を見つけてクリックするcontent.
次の HTML スニペットを考えてみましょう:
<code class="html"><div class="elements"> <button>Button text</button> <a href="#">Href text</a> <div>Div text</div> </div></code>
目的: 「ボタン テキスト」を含むボタン要素にクリック アクションを実装します。
解決策:
以下の XPath 式は、目的のテキストを含むボタンを識別します。
"//button[contains(., 'Button text')]"
ただし、周囲の
"//div[@class='elements']/button[contains(., 'Button text')]"
クリック アクションを実行するには:
const [button] = await page.$x("//div[@class='elements']/button[contains(., 'Button text')]");
if (button) {
await button.click();
}
説明:
.contains(. .contains(text(), 'Text') XPath 式では、.contains(text(), 'Text') の代わりに子ノードが含まれることが保証されるため、要素構造のより深いところにあるテキスト ノードが除外されません。
以上がPuppeteer を使用してテキスト コンテンツに基づいて要素をクリックする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。