{"id":2763,"date":"2023-12-01T12:40:47","date_gmt":"2023-12-01T11:40:47","guid":{"rendered":"https:\/\/ittester.sk\/non-classifiee\/css-selecteurs\/"},"modified":"2024-10-22T14:14:26","modified_gmt":"2024-10-22T12:14:26","slug":"css-selecteurs","status":"publish","type":"post","link":"https:\/\/ittester.sk\/fr\/tests-automatises\/tutoriel-selenium\/css-selecteurs\/","title":{"rendered":"S\u00e9lecteurs CSS"},"content":{"rendered":"\n<p>Dans cette partie du tutoriel, nous allons d\u00e9couvrir les s\u00e9lecteurs CSS et cr\u00e9er des s\u00e9lecteurs CSS manuellement \u00e0 l&rsquo;aide de divers attributs d&rsquo;\u00e9l\u00e9ments web HTML. Nous utilisons l&rsquo;outil firebug ou l&rsquo;outil developer pour obtenir les informations HTML des \u00e9l\u00e9ments web. Pour plus de d\u00e9tails sur le t\u00e9l\u00e9chargement et l&rsquo;utilisation de l&rsquo;outil firebug\/developer, consultez le tutoriel &#8211; <a href=\"https:\/\/ittester.sk\/fr\/tutoriel-selenium\/locators-in-selenium-webdriver\/\">Locators in Selenium WebDriver<\/a>.<\/p>\n\n<h2 class=\"wp-block-heading\">Table des mati\u00e8res<\/h2>\n<div class=\"wp-block-aioseo-table-of-contents\"><ul><li><a class=\"aioseo-toc-item\" href=\"#aioseo-css-a-selektory-css-uvod\">CSS a selektory CSS \u2013 \u00favod<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-selektory-css\">Selektory CSS<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-pouzivanie-id\">Pou\u017e\u00edvanie ID<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-pouzivanie-triedy-class\">Pou\u017e\u00edvanie triedy &#8211; class<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-pouzitie-znacky-tag\">Pou\u017eitie zna\u010dky &#8211; tag<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-pouzivanie-atributov-a-ich-hodnoty\">Pou\u017e\u00edvanie atrib\u00fatov a ich hodnoty<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-pouzivanie-znaciek-a-id-tags-and-id\">Pou\u017e\u00edvanie zna\u010diek a\u00a0id (tags and id)<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-pouzitie-znaciek-a-triedy-tags-and-class\">Pou\u017eitie zna\u010diek a\u00a0triedy (tags and class)<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-pouzivanie-znaciek-a-atributov-tags-and-attributes\">Pou\u017e\u00edvanie zna\u010diek a\u00a0atrib\u00fatov (tags and attributes)<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-vyhladavanie-podriadenych-prvkov-len-priame-podriadene-prvky-child\">Vyh\u013ead\u00e1vanie podriaden\u00fdch prvkov (len priame podriaden\u00e9 prvky &#8211; child)<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-umiestnenie-prvkov-vo-vnutri-inych-prvkov-child-subchild\">Umiestnenie prvkov vo vn\u00fatri in\u00fdch prvkov (child\/subchild)<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-n-te-dieta\">n-t\u00e9 die\u0165a<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-vyhladavanie-surodencov\">Vyh\u013ead\u00e1vanie s\u00farodencov<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-zacina-sa-na\">^ &#8211; Za\u010d\u00edna sa na<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-konci-sa-na\">$ &#8211; Kon\u010d\u00ed sa na<\/a><\/li><li><a class=\"aioseo-toc-item\" href=\"#aioseo-obsahuje\">* &#8211; Obsahuje<\/a><\/li><\/ul><\/div>\n<h2 class=\"wp-block-heading\" id=\"aioseo-css-a-selektory-css-uvod\">CSS et s\u00e9lecteurs CSS &#8211; introduction<\/h2>\n\n<p>CSS est l&rsquo;abr\u00e9viation de Cascading Style Sheets (feuilles de style en cascade), qui sont utilis\u00e9es pour styliser divers \u00e9l\u00e9ments d&rsquo;une page web HTML. Dans les fichiers .css, nous pouvons rechercher des \u00e9l\u00e9ments sp\u00e9cifiques d&rsquo;une page web (fichiers .html) et les styliser, par exemple en d\u00e9finissant la taille de la police, la largeur, la hauteur, etc.<\/p>\n\n<p>Nous utilisons certaines r\u00e8gles fournies en tant que s\u00e9lecteurs CSS pour trouver les \u00e9l\u00e9ments web \u00e0 styliser.<\/p>\n\n<p>Par exemple, la commande suivante recherche d&rsquo;abord un \u00e9l\u00e9ment web correspondant au mod\u00e8le de s\u00e9lecteur \u00ab\u00a0div#searchBox\u00a0\u00bb, puis aligne le texte qu&rsquo;il contient au centre.<\/p>\n\n<p><strong>div#searchBox { text-align : center;}<\/strong><\/p>\n\n<p>Dans Selenium, nous pouvons utiliser ces r\u00e8gles\/motifs de s\u00e9lection CSS pour rechercher des \u00e9l\u00e9ments web et effectuer ensuite diverses op\u00e9rations sur ceux-ci. Par exemple :<\/p>\n\n<p><strong>\/\/Localisation de l&rsquo;\u00e9l\u00e9ment searchBox \u00e0 l&rsquo;aide d&rsquo;un s\u00e9lecteur CSS<\/strong><\/p>\n\n<p><strong>WebElement searchBox = driver.findElement(By.cssSelector(\u00ab\u00a0div#searchBox\u00a0\u00bb)) ;<\/strong><\/p>\n\n<p><strong>\/Effectuer un clic sur l&rsquo;\u00e9l\u00e9ment<\/strong><\/p>\n\n<p><strong>searchBox.sendKeys(\u00ab\u00a0ITtester\u00a0\u00bb) ;<\/strong><\/p>\n\n<p>Voyons maintenant les diff\u00e9rentes r\u00e8gles de s\u00e9lection CSS, leur syntaxe et des exemples d&rsquo;utilisation.<\/p>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-selektory-css\">S\u00e9lecteurs CSS<\/h2>\n\n<p>Vous trouverez ci-dessous la syntaxe et des exemples pour trouver les \u00e9l\u00e9ments n\u00e9cessaires et les utiliser dans les scripts Selenium.<\/p>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-pouzivanie-id\">Utilisation de la carte d&rsquo;identit\u00e9<\/h2>\n\n<p><strong>R\u00e8gle de s\u00e9lection CSS &#8211; #id<\/strong><\/p>\n\n<p>Pour l&rsquo;exemple HTML ci-dessous<\/p>\n\n<p><strong>&lt;&gt;&lt;button id=\u00a0\u00bbsubmitButton1&Prime; type=\u00a0\u00bbbutton\u00a0\u00bb class=\u00a0\u00bbbtn\u00a0\u00bb Soumettre \/button&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localisateur CSS &#8211; #submitButton1<\/li>\n\n\n\n<li>Description &#8211; \u00ab\u00a0#submitButton1\u00a0\u00bb s\u00e9lectionne l&rsquo;\u00e9l\u00e9ment dont l&rsquo;identifiant est \u00ab\u00a0submitButton1\u00a0\u00bb.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-pouzivanie-triedy-class\">Utilisation de la classe &#8211; classe<\/h2>\n\n<p><strong>R\u00e8gle de s\u00e9lection CSS &#8211; .class<\/strong><\/p>\n\n<p>Pour l&rsquo;exemple HTML ci-dessous<\/p>\n\n<p><strong>&lt;&gt;&lt;button id=\u00a0\u00bbsubmitButton1&Prime; type=\u00a0\u00bbbutton\u00a0\u00bb class=\u00a0\u00bbbtn\u00a0\u00bb Soumettre \/button&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localisateur CSS &#8211; .btn<\/li>\n\n\n\n<li>Description &#8211; &lsquo;.btn&rsquo; s\u00e9lectionne tous les \u00e9l\u00e9ments de la classe &lsquo;btn&rsquo;.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-pouzitie-znacky-tag\">Utilisation d&rsquo;une balise &#8211; balise<\/h2>\n\n<p><strong>R\u00e8gle de s\u00e9lection CSS &#8211; nom de la balise<\/strong><\/p>\n\n<p>Pour l&rsquo;exemple HTML ci-dessous<\/p>\n\n<p><strong>&lt;input id=\u00a0\u00bbfname\u00a0\u00bb type=\u00a0\u00bbtext\u00a0\u00bb name=\u00a0\u00bbfirstName\u00a0\u00bb class=\u00a0\u00bbtextbox\u00a0\u00bb&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localisateur CSS &#8211; entr\u00e9e<\/li>\n\n\n\n<li>Description &#8211; \u00ab\u00a0input\u00a0\u00bb s\u00e9lectionne tous les \u00e9l\u00e9ments de type input.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-pouzivanie-atributov-a-ich-hodnoty\">Utilisation des attributs et de leurs valeurs<\/h2>\n\n<p><strong>R\u00e8gle de s\u00e9lection CSS &#8211;  [attributeName=&rsquo;attributeValue&rsquo;]<\/strong><\/p>\n\n<p>Pour l&rsquo;exemple HTML ci-dessous<\/p>\n\n<p><strong>&lt;input id=\u00a0\u00bbfname\u00a0\u00bb type=\u00a0\u00bbtext\u00a0\u00bb name=\u00a0\u00bbfirstName\u00a0\u00bb class=\u00a0\u00bbtextbox\u00a0\u00bb&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localisateur CSS &#8211;  [name=&rsquo;firstName&rsquo;]<\/li>\n\n\n\n<li>[name=&rsquo;firstName&rsquo;] Description &#8211; s\u00e9lectionne les \u00e9l\u00e9ments dont l&rsquo;attribut name a pour valeur \u00ab\u00a0firstName\u00a0\u00bb.<\/li>\n<\/ul>\n\n<p>Ces r\u00e8gles de base de localisation des \u00e9l\u00e9ments web peuvent maintenant \u00eatre utilis\u00e9es conjointement pour cr\u00e9er des localisateurs plus robustes qui s\u00e9lectionneront des \u00e9l\u00e9ments uniques.<\/p>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-pouzivanie-znaciek-a-id-tags-and-id\">Utilisation de balises et d&rsquo;identifiants<\/h2>\n\n<p><strong>R\u00e8gle de s\u00e9lection CSS &#8211; tag#id<\/strong><\/p>\n\n<p>Pour l&rsquo;exemple HTML ci-dessous<\/p>\n\n<p><strong>&lt;input id=\u00a0\u00bbfname\u00a0\u00bb type=\u00a0\u00bbtext\u00a0\u00bb name=\u00a0\u00bbfirstName\u00a0\u00bb class=\u00a0\u00bbtextbox\u00a0\u00bb&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localisateur CSS &#8211; input#fname<\/li>\n\n\n\n<li>Description &#8211; input#fname s\u00e9lectionne l&rsquo;\u00e9l\u00e9ment \u00ab\u00a0input\u00a0\u00bb avec l&rsquo;identifiant \u00ab\u00a0fname\u00a0\u00bb.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-pouzitie-znaciek-a-triedy-tags-and-class\">Utilisation de balises et de classes<\/h2>\n\n<p><strong>R\u00e8gle de s\u00e9lection CSS &#8211; tag.class<\/strong><\/p>\n\n<p>Pour l&rsquo;exemple HTML ci-dessous<\/p>\n\n<p><strong>&lt;input id=\u00a0\u00bbfname\u00a0\u00bb type=\u00a0\u00bbtext\u00a0\u00bb name=\u00a0\u00bbfirstName\u00a0\u00bb class=\u00a0\u00bbtextbox\u00a0\u00bb&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localisateur CSS &#8211; input.textbox<\/li>\n\n\n\n<li>Description &#8211; input.textbox s\u00e9lectionne l&rsquo;\u00e9l\u00e9ment \u00ab\u00a0input\u00a0\u00bb avec l&rsquo;identifiant \u00ab\u00a0textbox\u00a0\u00bb.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-pouzivanie-znaciek-a-atributov-tags-and-attributes\">Utilisation des balises et des attributs<\/h2>\n\n<p><strong>R\u00e8gle de s\u00e9lection CSS &#8211; balise[attributeName=&rsquo;attributeValue&rsquo;]<\/strong><\/p>\n\n<p>Pour l&rsquo;exemple HTML ci-dessous<\/p>\n\n<p><strong>&lt;input id=\u00a0\u00bbfname\u00a0\u00bb type=\u00a0\u00bbtext\u00a0\u00bb name=\u00a0\u00bbfirstName\u00a0\u00bb class=\u00a0\u00bbtextbox\u00a0\u00bb&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localisateur CSS &#8211; entr\u00e9e[name= firstname=\u00a0\u00bb\u00a0\u00bb]<\/li>\n\n\n\n<li>[name= firstname=\u00a0\u00bb\u00a0\u00bb] Description &#8211; input s\u00e9lectionne l&rsquo;\u00e9l\u00e9ment \u00ab\u00a0input\u00a0\u00bb avec l&rsquo;attribut \u00ab\u00a0name\u00a0\u00bb et la valeur \u00ab\u00a0firstName\u00a0\u00bb.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-vyhladavanie-podriadenych-prvkov-len-priame-podriadene-prvky-child\">Recherche d&rsquo;\u00e9l\u00e9ments enfants (uniquement les \u00e9l\u00e9ments enfants directs &#8211; enfant)<\/h2>\n\n<p><strong>&gt;R\u00e8gle de s\u00e9lection CSS &#8211; parentLocator childLocator<\/strong><\/p>\n\n<p>Pour l&rsquo;exemple HTML ci-dessous<\/p>\n\n<p><strong>&lt;div id=\u00a0\u00bbbuttonDiv\u00a0\u00bb class=\u00a0\u00bbsmall\u00a0\u00bb&gt;<\/strong><\/p>\n\n<p><strong>&lt;&gt;&lt;button id=\u00a0\u00bbsubmitButton1&Prime; type=\u00a0\u00bbbutton\u00a0\u00bb class=\u00a0\u00bbbtn\u00a0\u00bb Soumettre \/button&gt;<\/strong><\/p>\n\n<p><strong>&lt;\/div&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localisateur CSS &#8211; div#buttonDiv&gt;button<\/li>\n\n\n\n<li>Description &#8211; \u00ab\u00a0div#buttonDiv&gt;button\u00a0\u00bb va d&rsquo;abord \u00e0 l&rsquo;\u00e9l\u00e9ment div avec l&rsquo;id \u00ab\u00a0buttonDiv\u00a0\u00bb et s\u00e9lectionne ensuite son \u00e9l\u00e9ment enfant &#8211; \u00ab\u00a0button\u00a0\u00bb.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-umiestnenie-prvkov-vo-vnutri-inych-prvkov-child-subchild\">Placement d&rsquo;\u00e9l\u00e9ments \u00e0 l&rsquo;int\u00e9rieur d&rsquo;autres \u00e9l\u00e9ments (enfant\/sous-enfant)<\/h2>\n\n<p><strong>R\u00e8gle de s\u00e9lection CSS &#8211; locator1 locator2<\/strong><\/p>\n\n<p>Pour l&rsquo;exemple HTML ci-dessous<\/p>\n\n<p><strong>&lt;div id=\u00a0\u00bbbuttonDiv\u00a0\u00bb class=\u00a0\u00bbsmall\u00a0\u00bb&gt;<\/strong><\/p>\n\n<p><strong>&lt;&gt;&lt;button id=\u00a0\u00bbsubmitButton1&Prime; type=\u00a0\u00bbbutton\u00a0\u00bb class=\u00a0\u00bbbtn\u00a0\u00bb Soumettre \/button&gt;<\/strong><\/p>\n\n<p><strong>&lt;\/div&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localisateur CSS &#8211; bouton div#buttonDiv<\/li>\n\n\n\n<li>Description &#8211; \u00ab\u00a0div#buttonDiv button\u00a0\u00bb navigue d&rsquo;abord vers l&rsquo;\u00e9l\u00e9ment div avec l&rsquo;id \u00ab\u00a0buttonDiv\u00a0\u00bb et s\u00e9lectionne ensuite l&rsquo;\u00e9l\u00e9ment \u00ab\u00a0button\u00a0\u00bb \u00e0 l&rsquo;int\u00e9rieur de celui-ci (qui peut \u00eatre son enfant ou un enfant).<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-n-te-dieta\">ni\u00e8me enfant<\/h2>\n\n<p><strong>R\u00e8gle de s\u00e9lection CSS &#8211; :nth-child(n)<\/strong><\/p>\n\n<p>Pour l&rsquo;exemple HTML ci-dessous<\/p>\n\n<p><strong>&lt;ul id=\u00a0\u00bbtestingTypes\u00a0\u00bb&gt;<\/strong><\/p>\n\n<p><strong>   &lt;&gt;&lt;li Tests d&rsquo;automatisation \/li&gt;<\/strong><\/p>\n\n<p><strong>   &lt;&gt;&lt;li Tests de performance \/li&gt;<\/strong><\/p>\n\n<p><strong>   &lt;&gt;&lt;li Tests manuels \/li&gt;<\/strong><\/p>\n\n<p><strong>&lt;\/ul&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>CSS Locator &#8211; #testingTypes li:nth-child(2)<\/li>\n\n\n\n<li>Description &#8211; &lsquo;#testingTypes li:nth-child(2)&rsquo; s\u00e9lectionne l&rsquo;\u00e9l\u00e9ment avec l&rsquo;id &lsquo;testingType&rsquo; et en trouve 2. d&rsquo;un descendant de type li, t. j. \u00c9l\u00e9ment de la liste \u00ab\u00a0Test de performance\u00a0\u00bb.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-vyhladavanie-surodencov\">Recherche de fr\u00e8res et s\u0153urs<\/h2>\n\n<p><strong>R\u00e8gle de s\u00e9lection CSS &#8211; locator1+locator2<\/strong><\/p>\n\n<p>Pour l&rsquo;exemple HTML ci-dessous<\/p>\n\n<p><strong>&lt;ul id=\u00a0\u00bbtestingTypes\u00a0\u00bb&gt;<\/strong><\/p>\n\n<p><strong>   &lt;&gt;&lt;li id=\u00a0\u00bbautomation\u00a0\u00bb Test d&rsquo;automatisation \/li&gt;<\/strong><\/p>\n\n<p><strong>   &lt;&gt;&lt;li Tests de performance \/li&gt;<\/strong><\/p>\n\n<p><strong>   &lt;&gt;&lt;li Tests manuels \/li&gt;<\/strong><\/p>\n\n<p><strong>&lt;\/ul&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localisateur CSS &#8211; li#automation + li<\/li>\n\n\n\n<li>Description &#8211; &lsquo;li#automation + li&rsquo; va d&rsquo;abord \u00e0 l&rsquo;\u00e9l\u00e9ment li avec l&rsquo;id &lsquo;automation&rsquo; et s\u00e9lectionne ensuite son li voisin, t. j. \u00c9l\u00e9ment de la liste \u00ab\u00a0Test de performance\u00a0\u00bb.<\/li>\n<\/ul>\n\n<p>Pour le traitement des \u00e9l\u00e9ments dynamiques dont les identifiants et autres localisateurs sont g\u00e9n\u00e9r\u00e9s dynamiquement (non connus \u00e0 l&rsquo;avance). Nous pouvons exploiter les localisateurs ci-dessus en utilisant diff\u00e9rentes relations parents-fr\u00e8res des \u00e9l\u00e9ments dynamiques. En outre, nous pouvons \u00e9galement utiliser certains localisateurs CSS sp\u00e9ciaux pour attribuer des valeurs d&rsquo;attributs partiels.<\/p>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-zacina-sa-na\">^ &#8211; A partir de<\/h2>\n\n<p><strong>R\u00e8gle de s\u00e9lection CSS &#8211;  [attribute^=attributeValue]<\/strong><\/p>\n\n<p>Pour l&rsquo;exemple HTML ci-dessous<\/p>\n\n<p><strong>&lt;&gt;&lt;button id=\u00a0\u00bbuser1_btn_263&Prime; type=\u00a0\u00bbbutton\u00a0\u00bb class=\u00a0\u00bbbtn\u00a0\u00bb Envoyer \u00e0 \/button&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localisateur CSS &#8211; id^=\u00a0\u00bbuser1\u2033<\/li>\n\n\n\n<li>Description &#8211; &lsquo;id^=\u00a0\u00bbuser1\u2033 s\u00e9lectionne l&rsquo;\u00e9l\u00e9ment dont l&rsquo;id commence par \u00ab\u00a0user1\u00a0\u00bb.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-konci-sa-na\">$ &#8211; Se termine en<\/h2>\n\n<p><strong>R\u00e8gle de s\u00e9lection CSS &#8211;  [attribute$=attributeValue]<\/strong><\/p>\n\n<p>Pour l&rsquo;exemple HTML ci-dessous<\/p>\n\n<p><strong>&lt;&gt;&lt;button id=\u00a0\u00bbuser1_btn_263&Prime; type=\u00a0\u00bbbutton\u00a0\u00bb class=\u00a0\u00bbbtn\u00a0\u00bb Soumettre \/button&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localisateur CSS &#8211; id$=\u00a0\u00bbbtn_263\u2033.<\/li>\n\n\n\n<li>Description &#8211; &lsquo;id$=\u00a0\u00bbbtn_263\u2033 s\u00e9lectionne l&rsquo;\u00e9l\u00e9ment dont l&rsquo;identifiant se termine par \u00ab\u00a0btn_263\u00a0\u00bb.<\/li>\n<\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"aioseo-obsahuje\">* &#8211; Contient<\/h2>\n\n<p><strong>R\u00e8gle de s\u00e9lection CSS &#8211;  [attribute*=attributeValue]<\/strong><\/p>\n\n<p>Pour l&rsquo;exemple HTML ci-dessous<\/p>\n\n<p><strong>&lt;&gt;&lt;button id=\u00a0\u00bbuser1_btn_263&Prime; type=\u00a0\u00bbbutton\u00a0\u00bb class=\u00a0\u00bbbtn\u00a0\u00bb Soumettre \/button&gt;<\/strong><\/p>\n\n<ul class=\"wp-block-list\">\n<li>Localisateur CSS &#8211; id*=\u00a0\u00bbbtn\u00a0\u00bb<\/li>\n\n\n\n<li>Description &#8211; \u00ab\u00a0id*=\u00a0\u00bbbtn\u00a0\u00bb\u00a0\u00bb s\u00e9lectionne l&rsquo;\u00e9l\u00e9ment dont l&rsquo;id contient la valeur \u00ab\u00a0btn\u00a0\u00bb<\/li>\n<\/ul>\n\n<p>C&rsquo;est tout ce que nous avons pr\u00e9par\u00e9 dans cet article. Le <a href=\"https:\/\/ittester.sk\/automatizovane-testovanie\/selenium-tutorial\/selenium-tutorial\/\">tutoriel<\/a> complet <a href=\"https:\/\/ittester.sk\/automatizovane-testovanie\/selenium-tutorial\/selenium-tutorial\/\">sur Selenium<\/a>.  <\/p>\n","protected":false},"excerpt":{"rendered":"<p>Nous utilisons certaines r\u00e8gles, appel\u00e9es s\u00e9lecteurs CSS, pour trouver les \u00e9l\u00e9ments web \u00e0 styliser.  <\/p>\n","protected":false},"author":8,"featured_media":2764,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[53],"tags":[],"class_list":["post-2763","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutoriel-selenium"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/ittester.sk\/fr\/wp-json\/wp\/v2\/posts\/2763","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ittester.sk\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ittester.sk\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ittester.sk\/fr\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/ittester.sk\/fr\/wp-json\/wp\/v2\/comments?post=2763"}],"version-history":[{"count":1,"href":"https:\/\/ittester.sk\/fr\/wp-json\/wp\/v2\/posts\/2763\/revisions"}],"predecessor-version":[{"id":2765,"href":"https:\/\/ittester.sk\/fr\/wp-json\/wp\/v2\/posts\/2763\/revisions\/2765"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ittester.sk\/fr\/wp-json\/wp\/v2\/media\/2764"}],"wp:attachment":[{"href":"https:\/\/ittester.sk\/fr\/wp-json\/wp\/v2\/media?parent=2763"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ittester.sk\/fr\/wp-json\/wp\/v2\/categories?post=2763"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ittester.sk\/fr\/wp-json\/wp\/v2\/tags?post=2763"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}