Comment cliquer sur un élément basé sur le contenu textuel à l'aide de Puppeteer ?-js tutoriel-php.cn

Comment cliquer sur un élément basé sur le contenu textuel à l'aide de Puppeteer ?

Barbara Streisand

Libérer： 2024-10-29 07:30:30

original

370 Les gens l'ont consulté

How to Click an Element Based on Text Content Using Puppeteer?

Cliquer sur un élément avec du texte à l'aide de Puppeteer

Défi : Localiser et cliquer sur un élément en se basant uniquement sur son texte contenu.

Considérez l'extrait HTML suivant :

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

Copier après la connexion

Objectif : Implémentez une action de clic sur l'élément de bouton qui contient le « Texte du bouton ».

Solution :

L'expression XPath ci-dessous identifie le bouton contenant le texte souhaité :

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

Copier après la connexion

Cependant, pour assurer la compatibilité avec le

conteneur, utilisez cette expression modifiée :

"//div[@class='elements']/button[contains(., 'Button text')]"

Copier après la connexion

Pour exécuter l'action de clic :

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

Copier après la connexion

Explication :

Utilisation de .contains(. , 'Text') au lieu de .contains(text(), 'Text') L'expression XPath garantit qu'elle inclut les nœuds enfants, n'excluant ainsi pas les nœuds de texte plus profonds dans la structure de l'élément.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!