Jak používat Selen IDE se skripty & Příkazy (Assert, Verify)

Obsah:

Anonim

Jako testovanou webovou aplikaci budeme používat web Mercury Tours. Jedná se o online rezervační systém letů, který obsahuje všechny prvky, které pro tento tutoriál potřebujeme. Jeho URL je http://demo.guru99.com/test/newtours/ a toto bude naše základní URL.

Vytvořte skript nahráváním

Vytvořme nyní náš první testovací skript v selenovém IDE pomocí nejběžnější metody - nahráváním. Poté provedeme náš skript pomocí funkce přehrávání.

Krok 1

  • Spusťte Firefox a Selenium IDE.
  • Zadejte hodnotu pro naši základní adresu URL: http://demo.guru99.com/test/newtours/.
  • Zapněte tlačítko Záznam (pokud ještě není ve výchozím nastavení zapnuto).
Krok 2

Ve Firefoxu přejděte na http://demo.guru99.com/test/newtours/. Firefox by vás měl přesměrovat na stránku podobnou té, která je uvedena níže.

Krok 3
  • Klepněte pravým tlačítkem na prázdné místo na stránce, například na logo Mercury Tours v levém horním rohu. Tím se vyvolá kontextová nabídka IDE selenu. Poznámka: Neklikejte na žádné hypertextové odkazy na objekty nebo obrázky
  • Vyberte možnost „Zobrazit dostupné příkazy“.
  • Poté vyberte možnost „assertTitle exact: Welcome: Mercury Tours“. Toto je příkaz, který zajišťuje správnost názvu stránky.
Krok 4
  • Do textového pole „Uživatelské jméno“ v Mercury Tours zadejte neplatné uživatelské jméno „invalidUNN“.
  • Do textového pole „Heslo“ zadejte neplatné heslo „invalidPWD“.
Krok 5
  • Klikněte na tlačítko „Přihlásit se“. Firefox by vás měl přejít na tuto stránku.
Krok 6

Chcete-li zastavit nahrávání, vypněte tlačítko nahrávání. Váš skript by nyní měl vypadat jako ten, který je zobrazen níže.

Krok 7

Teď, když jsme hotovi s naším testovacím skriptem, uložíme ho do testovacího případu. V nabídce Soubor vyberte možnost „Uložit testovací případ“. Případně můžete jednoduše stisknout Ctrl + S.

Krok 8
  • Vyberte požadované umístění a pojmenujte testovací případ jako „Invalid_login“.
  • Klikněte na tlačítko „Uložit“.
Krok 9.

Všimněte si, že soubor byl uložen jako HTML.

Krok 10.

Vraťte se do Selenium IDE a kliknutím na tlačítko Přehrát spusťte celý skript. Selen IDE by mělo být schopné replikovat vše bezchybně.

Úvod do příkazů selenu - selenština

  • Selenské příkazy mohou mít maximálně dva parametry: cíl a hodnotu.
  • Parametry nejsou vždy vyžadovány. Záleží na tom, kolik bude příkaz potřebovat.

3 typy příkazů

Akce

Jedná se o příkazy, které přímo interagují s prvky stránky.

Příklad: příkaz „kliknout“ je akce, protože přímo komunikujete s prvkem, na který klikáte.

Příkaz „typ“ je také akce, protože vkládáte hodnoty do textového pole a textové pole vám je na oplátku zobrazí. Mezi vámi a textovým polem existuje obousměrná interakce.

Přistupující osoby

Jsou to příkazy, které vám umožňují ukládat hodnoty do proměnné.

Příklad: příkaz „storeTitle“ je přístupový objekt, protože pouze „čte“ nadpis stránky a ukládá jej do proměnné. Neinteraguje s žádným prvkem na stránce.

Tvrzení

Jsou to příkazy, které ověřují, zda je splněna určitá podmínka.

3 typy tvrzení

  • Tvrdit . Pokud příkaz „assert“ selže, test se okamžitě zastaví.
  • Ověřit . Když selže příkaz „ověřit“, Selenium IDE zaznamená tuto chybu a pokračuje v provádění testu.
  • Počkej na . Než přejdete k dalšímu příkazu, budou příkazy „waitFor“ nejprve čekat na splnění určité podmínky.
    • Pokud se podmínka stane pravdivou během čekací doby, krok projde.
    • Pokud se podmínka nestane pravdivou, krok selže. Selhání je protokolováno a provádění testu pokračuje dalším příkazem.
    • Ve výchozím nastavení je hodnota časového limitu nastavena na 30 sekund. Můžete to změnit v dialogovém okně Možnosti IDE selenu na kartě Obecné.

Assert vs. Verify

Společné příkazy

Příkaz Počet parametrů Popis
otevřeno 0 - 2

Otevře stránku pomocí adresy URL.

click / clickAndWait 1

Klikne na zadaný prvek.

typ / typKlíče 2

Zadá posloupnost znaků.

verifyTitle / assertTitle 1

Porovná skutečný název stránky s očekávanou hodnotou.

verifyTextPresent 1

Zkontroluje, zda se na stránce nachází určitý text.

verifyElementPresent 1

Zkontroluje přítomnost určitého prvku.

ověřitTabulka 2

Porovná obsah tabulky s očekávanými hodnotami.

waitForPageToLoad 1

Pozastaví provádění, dokud se stránka nenačte úplně.

waitForElementPresent 1

Pozastaví provádění, dokud nebude uveden zadaný prvek.

Vytvořte skript ručně pomocí Firebug

Nyní vytvoříme stejný testovací případ ručně zadáním příkazů. Tentokrát budeme muset použít Firebug.

Krok 1
  • Otevřete prohlížeč Firefox a Selenium IDE.
  • Zadejte základní adresu URL (http://demo.guru99.com/test/newtours/).
  • Tlačítko záznamu by mělo být VYPNUTO.
Krok 2: Klikněte na nejvyšší prázdný řádek v editoru.

Do textového pole Příkaz zadejte „otevřít“ a stiskněte klávesu Enter.

Krok 3
  • Přejděte Firefox na naši základní adresu URL a aktivujte Firebug
  • V podokně editoru IDE Selenium vyberte druhý řádek (řádek pod příkazem „otevřít“) a vytvořte druhý příkaz zadáním „assertTitle“ do pole Příkaz.
  • Klidně použijte funkci automatického doplňování.
Krok 4
  • Ve Firebugu rozbalte značku , aby se zobrazila značka .</li> <li>Klikněte na hodnotu značky <title> (což je „Welcome: Mercury Tours“) a vložte ji do pole Target v Editoru.</li> </ul> </td> </tr> <tr> <td><strong>Krok 5</strong> <ul> <li>Chcete-li vytvořit třetí příkaz, klikněte na třetí prázdný řádek v editoru a zadejte „text“ do textového pole Příkaz.</li> <li>Ve Firebugu klikněte na tlačítko „Zkontrolovat“.</li> </ul> </td> </tr> <tr> <td>Klikněte na textové pole Uživatelské jméno. Všimněte si, že Firebug vám automaticky zobrazí HTML kód pro tento prvek.</td> </tr> <tr> <td><strong>Krok 6</strong> <p>Všimněte si, že textové pole Uživatelské jméno nemá ID, ale má atribut NAME. Proto budeme jako vyhledávač používat jeho NÁZEV. Zkopírujte hodnotu JMÉNO a vložte ji do pole Cíl v Selenium IDE.</p> <p>V textovém poli Cílová předpona „userName“ s „name =“, což znamená, že selenové IDE by mělo cílit na prvek, jehož atribut NAME je „userName“.</p> <p>Do textového pole Hodnota selenového IDE napište „invalidUN“. Váš testovací skript by nyní měl vypadat jako na obrázku níže. S třetím příkazem jsme skončili. Poznámka: Místo neplatného UN můžete zadat jakýkoli jiný textový řetězec. Selenium IDE ale rozlišuje velká a malá písmena a vy zadáváte hodnoty / atributy přesně jako v aplikaci.</p> </td> </tr> <tr> <td><strong>Krok 7</strong> <ul> <li>Chcete-li vytvořit čtvrtý příkaz, zadejte do textového pole Příkaz „zadejte“.</li> <li>Pomocí tlačítka Firebug „Zkontrolovat“ znovu získáte lokátor textového pole „Heslo“.</li> </ul> <ul> <li> <p>Vložte atribut JMÉNO („heslo“) do pole Cíl a vložte před něj „name =“</p> </li> <li> <p>Do pole Hodnota v Selenium IDE napište „invalidPW“. Váš testovací skript by nyní měl vypadat jako na obrázku níže.</p> </li> </ul> </td> </tr> <tr> <td><strong>Krok 8</strong> <ul> <li>U pátého příkazu zadejte do textového pole Příkaz v IDE selenu „clickAndWait“.</li> <li>Pomocí tlačítka „Zkontrolovat“ Firebug získáte vyhledávač pro tlačítko „Přihlásit se“.</li> </ul> <ul> <li>Vložte hodnotu atributu JMÉNO („přihlášení“) do textového pole Cíl a přidejte před něj „name =“.</li> <li>Váš testovací skript by nyní měl vypadat jako na obrázku níže.</li> </ul> </td> </tr> </tbody> </table> <p><strong>Krok 9:</strong> Uložte testovací případ stejným způsobem jako v předchozí části.</p> <a id="menu-6"></a> <h2>Pomocí tlačítka Najít</h2> <p><strong>Tlačítko Najít v IDE selenu slouží k ověření, zda to, co jsme vložili do textového pole Cíl, je skutečně správný prvek uživatelského rozhraní.</strong></p> <p>Použijme testovací případ Invalid_login, který jsme vytvořili v předchozích částech. Klikněte na libovolný příkaz se záznamem Target, řekněme třetí příkaz.</p> <p>Klikněte na tlačítko Najít. Všimněte si, že textové pole Uživatelské jméno na stránce Mercury Tours se na okamžik zvýrazní.</p> <p>To naznačuje, že IDE selenu dokázalo správně detekovat a přistupovat k očekávanému prvku. Pokud tlačítko Najít zvýraznilo jiný prvek nebo vůbec žádný, pak musí být ve vašem skriptu něco špatně.</p> <a id="menu-7"></a> <h2>Proveďte příkaz</h2> <p><strong>To vám umožní provést libovolný jeden příkaz bez spuštění celého testovacího případu</strong> . Stačí kliknout na řádek, který chcete provést, a poté buď kliknout na „Akce> Spustit tento příkaz“ z řádku nabídek nebo jednoduše stisknout „X“ na klávesnici.</p> <p><strong>Krok 1.</strong> Ujistěte se, že je váš prohlížeč na domovské stránce Mercury Tours. Klikněte na příkaz, který chcete provést. V tomto příkladu klikněte na řádek „type | userName | invalidUN“.</p> <p><strong>Krok 2.</strong> Stiskněte „X“ na klávesnici.</p> <p><strong>Krok 3.</strong> Všimněte si, že textové pole pro uživatelské jméno bude vyplněno textem „invalidUN“</p> <p><strong>Provádění příkazů tímto způsobem je vysoce závislé na stránce, kterou Firefox aktuálně zobrazuje</strong> . To znamená, že pokud vyzkoušíte výše uvedený příklad se zobrazenou domovskou stránkou Google namísto Mercury Tours, váš krok se nezdaří, protože na domovské stránce Google není žádné textové pole s atributem „userName“.</p> <a id="menu-8"></a> <h2>Startovní bod</h2> <p><strong>Počáteční bod je indikátor, který říká selenovému IDE, které řádky začnou s prováděním</strong> . <strong>Jeho klávesová zkratka je „S“.</strong></p> <p>Ve výše uvedeném příkladu se přehrávání spustí na třetím řádku (zadejte | heslo | invalidPW). <strong>V jednom testovacím skriptu můžete mít pouze jeden počáteční bod.</strong></p> <p>Počáteční bod je podobný příkazu Provést v tom, že jsou závislé na aktuálně zobrazené stránce. Počáteční bod selže, pokud jste na nesprávné stránce.</p> <a id="menu-9"></a> <h2>Hraniční body</h2> <p>Hraniční body jsou indikátory, které říkají Selenium IDE, kde má automaticky pozastavit test. <strong>Klávesová zkratka je „B“.</strong></p> <p>Žluté zvýraznění znamená, že aktuální krok čeká na vyřízení. To dokazuje, že selenové IDE v tomto kroku pozastavilo provádění. <strong>V jednom testovacím případě můžete mít více zarážek.</strong></p> <a id="menu-10"></a> <h2>Krok</h2> <p>Umožňuje vám provádět po sobě následující příkazy po pozastavení testovacího případu. Použijme scénář v předchozí části „Hraniční body“.</p> <table> <tbody> <tr> <td width="50%"> </td> <td> <p><strong>Před kliknutím na „Krok“.</strong></p> <p>Testovací případ se pozastaví na řádku „clickAndWait | přihlášení“.</p> </td> </tr> <tr> <td width="50%"> </td> <td> <p><strong>Po kliknutí na „Krok“.</strong></p> <p>Spustí se řádek „clickAndWait | přihlášení“ a pozastaví se na další příkaz (verifyTitle | Sign-on: Mercury Tours).</p> <p>Všimněte si, že další řádek je pozastaven, i když tam není žádný zarážka. To je hlavní účel funkce Krok - provádí následující příkazy jeden po druhém, aby vám poskytl více času na kontrolu výsledku po každém kroku.</p> </td> </tr> </tbody> </table> <a id="menu-11"></a> <h2>Důležité věci, které je třeba si všimnout při použití jiných formátů v zobrazení zdroje</h2> <p><strong>Selenium IDE funguje dobře pouze s HTML - ostatní formáty jsou stále v experimentálním režimu</strong> . Je to <strong>není vhodné</strong> vytvářet nebo upravovat testy za použití jiných formátů zobrazení zdroje, protože tam je ještě hodně práce nezbytná, aby byl stabilní. Níže jsou známé chyby od verze 1.9.1.</p> <ul> <li>Nebudete moci provádět přehrávání ani přepnout zpět do zobrazení tabulky, pokud se nevrátíte k HTML.</li> <li>Jediným způsobem, jak bezpečně přidat příkazy do zdrojového kódu, je jejich záznam.</li> <li>Když zdrojový kód upravíte ručně, při přepnutí na jiný formát dojde ke ztrátě celého kódu.</li> <li>I když můžete svůj testovací případ uložit v zobrazení zdroje, Selenium IDE jej nebude moci otevřít.</li> </ul> <p><strong>Doporučeným způsobem převodu selenských testů je použití možnosti „Exportovat testovací případ jako…“ v nabídce Soubor, nikoli prostřednictvím zobrazení zdroje.</strong></p> <a id="menu-12"></a> <h2>souhrn</h2> <ul> <li>Testovací skripty lze vytvořit buď zaznamenáním nebo ručním zadáním příkazů a parametrů.</li> <li>Při ručním vytváření skriptů se k získání lokátoru používá Firebug.</li> <li>Tlačítko Najít slouží ke kontrole, zda má příkaz přístup ke správnému prvku.</li> <li>Zobrazení tabulky zobrazuje testovací skript ve formě tabulky, zatímco zobrazení zdroje zobrazení ve formátu HTML.</li> <li>Změna zobrazení zdroje na jiný formát než HTML je stále experimentální.</li> <li>Při vytváření testů v jiných formátech nepoužívejte zobrazení zdroje. Místo toho použijte funkce Export.</li> <li>Parametry nejsou vždy vyžadovány. Záleží na příkazu.</li> <li>Existují tři typy příkazů:</li> <ul> <li>Akce - přímo interaguje s prvky stránky</li> <li>Accessors - „čte“ vlastnost prvku a ukládá ji do proměnné</li> <li>Tvrzení - porovnává skutečnou hodnotu s očekávanou</li> </ul> <li>Tvrzení mají tři typy:</li> <ul> <li>Tvrdit - při selhání se další kroky již neprovádějí</li> <li>Ověření - i po selhání budou provedeny následující kroky.</li> <li>WaitFor - projde, pokud se zadaná podmínka stane pravdivou během časového limitu; jinak to selže</li> </ul> <li>Nejběžnější příkazy jsou:</li> <ul> <li>otevřeno</li> <li>click / clickAndWait</li> <li>typ / typKlíče</li> <li>verifyTitle / assertTitle</li> <li>verifyTextPresent</li> <li>verifyElementPresent</li> <li>ověřitTabulka</li> <li>waitForPageToLoad</li> <li>waitForElementPresent</li> </ul> </ul> </div> </article> <div id="container-5533149ee6411a5f99b370c693e87966"></div> </div> </div> </div> </div> </div> <aside class="col-lg-4 sidebar sidebar--right"> <div class="widget widget-popular-posts"> <h2 class="widget-title">Populární Příspěvky</h2> <ul class="post-list-small"> <li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__img-holder"> <div class="thumb-container thumb-100"><a href="/8222962-how-to-handle-ssl-certificate-in-selenium-webdriver" title="Jak zacházet s certifikátem SSL v selenu WebDriver" rel="bookmark"><img src="https://cdn.css-code.org/5407813/how_to_handle_ssl_certificate_in_selenium_webdriver.png.webp" loading="lazy" alt="Jak zacházet s certifikátem SSL v selenu WebDriver" title="Jak zacházet s certifikátem SSL v selenu WebDriver" class="post-list-small__img--rounded" style="width:88px;height:88px" /></a></div> </div> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8222962-how-to-handle-ssl-certificate-in-selenium-webdriver" title="Jak zacházet s certifikátem SSL v selenu WebDriver" rel="bookmark">Jak zacházet s certifikátem SSL v selenu WebDriver 2025</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__img-holder"> <div class="thumb-container thumb-100"><a href="/8222963-javascriptexecutor-in-selenium-webdriver-with-example" title="JavaScriptExecutor v selenu WebDriver s příkladem" rel="bookmark"><img src="https://cdn.css-code.org/5888312/javascriptexecutor_in_selenium_webdriver_with_example.png.webp" loading="lazy" alt="JavaScriptExecutor v selenu WebDriver s příkladem" title="JavaScriptExecutor v selenu WebDriver s příkladem" class="post-list-small__img--rounded" style="width:88px;height:88px" /></a></div> </div> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8222963-javascriptexecutor-in-selenium-webdriver-with-example" title="JavaScriptExecutor v selenu WebDriver s příkladem" rel="bookmark">JavaScriptExecutor v selenu WebDriver s příkladem 2025</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__img-holder"> <div class="thumb-container thumb-100"><a href="/8222965-how-to-use-intellij-ide-and-selenium-webdriver" title="Jak používat IntelliJ IDE & Selénový webdriver" rel="bookmark"><img src="https://cdn.css-code.org/8716492/how_to_use_intellij_ide_ampamp_selenium_webdriver.png.webp" loading="lazy" alt="Jak používat IntelliJ IDE & Selénový webdriver" title="Jak používat IntelliJ IDE & Selénový webdriver" class="post-list-small__img--rounded" style="width:88px;height:88px" /></a></div> </div> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8222965-how-to-use-intellij-ide-and-selenium-webdriver" title="Jak používat IntelliJ IDE & Selénový webdriver" rel="bookmark">Jak používat IntelliJ IDE & Selénový webdriver 2025</a></h3> </div> </div> </li> </ul> </div> <div class="widget widget-popular-posts"> <h2 class="widget-title">Nejlepší názory na měsíc</h2> <ul class="post-list-small"> <li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003231-13-intro-to-events" title="# 13: Úvod do událostí - Triky CSS" rel="bookmark"># 13: Úvod do událostí - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003232-14-custom-events" title="# 14: Vlastní události - Triky CSS" rel="bookmark"># 14: Vlastní události - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003233-20-data-data-data-attrdata" title="# 20: Data! data-*! .data()! .attr (data- *)! - Triky CSS" rel="bookmark"># 20: Data! data-*! .data()! .attr (data- *)! - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003235-16-intro-to-ajax" title="# 16: Úvod do Ajaxu Triky CSS" rel="bookmark"># 16: Úvod do Ajaxu Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003236-18-ajax-and-json" title="# 18: Ajax a JSON - Triky CSS" rel="bookmark"># 18: Ajax a JSON - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003237-15-chaining" title="# 15: Řetězení - Triky CSS" rel="bookmark"># 15: Řetězení - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003238-17-posting-with-ajax" title="# 17: POSTING s Ajaxem - Triky CSS" rel="bookmark"># 17: POSTING s Ajaxem - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003239-19-its-just-javascript" title="# 19: Je to jen JavaScript - Triky CSS" rel="bookmark"># 19: Je to jen JavaScript - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003241-22-the-need-for-templating" title="# 22: Potřeba šablony - Triky CSS" rel="bookmark"># 22: Potřeba šablony - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003242-21-just-change-classes" title="# 21: Stačí změnit třídy! - Triky CSS" rel="bookmark"># 21: Stačí změnit třídy! - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003243-23-templating-with-handlebars" title="# 23: Šablona s řídítky - Triky CSS" rel="bookmark"># 23: Šablona s řídítky - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003244-24-templating-with-underscore" title="# 24: Šablona s podtržítkem - Triky CSS" rel="bookmark"># 24: Šablona s podtržítkem - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003245-25-getting-organized" title="# 25: Organizace! - Triky CSS" rel="bookmark"># 25: Organizace! - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003246-26-using-a-jquery-plugin-from-the-wild" title="# 26: Používání pluginu jQuery z divočiny - Triky CSS" rel="bookmark"># 26: Používání pluginu jQuery z divočiny - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8003248-27-building-a-simple-jquery-plugin" title="# 27: Vytvoření jednoduchého pluginu jQuery - Triky CSS" rel="bookmark"># 27: Vytvoření jednoduchého pluginu jQuery - Triky CSS</a></h3> </div> </div> </li> </ul> </div> <div id="container-5533149ee6411a5f99b370c693e87966"></div> <div class="widget widget-popular-posts"> <h2 class="widget-title">Nejlepší Články</h2> <ul class="post-list-small"> <li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__img-holder"> <div class="thumb-container thumb-100"><a href="/8226214-top-22-vba-interview-questions-and-answers" title="Top 22 VBA Interview Questions & Odpovědi" rel="bookmark"><img src="https://cdn.css-code.org/5619934/top_22_vba_interview_questions_ampamp_answers.png.webp" loading="lazy" alt="Top 22 VBA Interview Questions & Odpovědi" title="Top 22 VBA Interview Questions & Odpovědi" class="post-list-small__img--rounded" style="width:88px;height:88px" /></a></div> </div> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8226214-top-22-vba-interview-questions-and-answers" title="Top 22 VBA Interview Questions & Odpovědi" rel="bookmark">Top 22 VBA Interview Questions & Odpovědi 2025</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__img-holder"> <div class="thumb-container thumb-100"><a href="/8226215-14-best-algorithm-and-data-structures-books-2021-list" title="14 NEJLEPŠÍ Algoritmus & Knihy o datových strukturách (seznam 2021)" rel="bookmark"><img src="https://cdn.css-code.org/5700941/14_best_algorithm_ampamp_data_structures_books_2021_list.jpg.webp" loading="lazy" alt="14 NEJLEPŠÍ Algoritmus & Knihy o datových strukturách (seznam 2021)" title="14 NEJLEPŠÍ Algoritmus & Knihy o datových strukturách (seznam 2021)" class="post-list-small__img--rounded" style="width:88px;height:88px" /></a></div> </div> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8226215-14-best-algorithm-and-data-structures-books-2021-list" title="14 NEJLEPŠÍ Algoritmus & Knihy o datových strukturách (seznam 2021)" rel="bookmark">14 NEJLEPŠÍ Algoritmus & Knihy o datových strukturách (seznam 2021) 2025</a></h3> </div> </div> </li><li class="post-list-small__item"> <div class="post-list-small__entry clearfix"> <div class="post-list-small__img-holder"> <div class="thumb-container thumb-100"><a href="/8226216-how-to-create-ec2-instance-in-aws-step-by-step-tutorial" title="Jak vytvořit instanci EC2 v AWS: Výukový program krok za krokem" rel="bookmark"><img src="https://cdn.css-code.org/5087403/how_to_create_ec2_instance_in_aws_step_by_step_tutorial.png.webp" loading="lazy" alt="Jak vytvořit instanci EC2 v AWS: Výukový program krok za krokem" title="Jak vytvořit instanci EC2 v AWS: Výukový program krok za krokem" class="post-list-small__img--rounded" style="width:88px;height:88px" /></a></div> </div> <div class="post-list-small__body"> <h3 class="post-list-small__entry-title"><a href="/8226216-how-to-create-ec2-instance-in-aws-step-by-step-tutorial" title="Jak vytvořit instanci EC2 v AWS: Výukový program krok za krokem" rel="bookmark">Jak vytvořit instanci EC2 v AWS: Výukový program krok za krokem 2025</a></h3> </div> </div> </li> </ul> </div> </aside> </div> </div> <footer class="footer footer--dark"> <div class="container"> <div class="footer__widgets"> <div class="row"> <div class="col-lg-4"> <div class="widget"> <h2 class="widget-title">Populární Příspěvky</h2> <ul class="post-list-small"> <li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8004118-remove-the-28px-push-down-from-the-admin-bar" title="Odeberte 28px Push Down z Admin Bar - Triky CSS" rel="bookmark">Odeberte 28px Push Down z Admin Bar - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8004119-remove-width-and-height-attributes-from-inserted-images" title="Odebrat atributy šířky a výšky z vložených obrázků - Triky CSS" rel="bookmark">Odebrat atributy šířky a výšky z vložených obrázků - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8004120-removing-jetpack-css" title="Odebrání Jetpack CSS - Triky CSS" rel="bookmark">Odebrání Jetpack CSS - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8004121-reset-admin-password-through-database" title="Obnovit heslo správce prostřednictvím databáze - Triky CSS" rel="bookmark">Obnovit heslo správce prostřednictvím databáze - Triky CSS</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8004122-run-a-loop-outside-of-wordpress" title="Spusťte smyčku mimo WordPress - Triky CSS" rel="bookmark">Spusťte smyčku mimo WordPress - Triky CSS</a></h3> </div> </div> </li> </ul> </div> </div> <div class="col-lg-4"> <div class="widget"> <h2 class="widget-title">Redakce Choice</h2> <ul class="post-list-small"> <li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226567-wordnet-with-nltk-finding-synonyms-for-words-in-python" title="WordNet s NLTK: Hledání synonym pro slova v Pythonu" rel="bookmark">WordNet s NLTK: Hledání synonym pro slova v Pythonu</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226568-stemming-and-lemmatization-with-python-nltk" title="Stemming a lemmatizace s Python NLTK" rel="bookmark">Stemming a lemmatizace s Python NLTK</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226569-tagging-problems-and-hidden-markov-model" title="Problémy se značkováním a skrytý Markovův model" rel="bookmark">Problémy se značkováním a skrytý Markovův model</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226570-word-embedding-tutorial-word2vec-using-gensim-example" title="Výukový program pro vkládání slov: word2vec pomocí Gensim (PŘÍKLAD)" rel="bookmark">Výukový program pro vkládání slov: word2vec pomocí Gensim (PŘÍKLAD)</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8226572-how-to-install-numpy" title="Jak nainstalovat NumPy" rel="bookmark">Jak nainstalovat NumPy</a></h3> </div> </div> </li> </ul> </div> </div> <div class="col-lg-4"> <div class="widget"> <h2 class="widget-title">Nejlepší Články</h2> <ul class="post-list-small"> <li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8225781-7-best-wayback-machine-internet-archive-alternatives-in-2021" title="7 NEJLEPŠÍ alternativy Wayback Machine (internetový archiv) v roce 2021" rel="bookmark">7 NEJLEPŠÍ alternativy Wayback Machine (internetový archiv) v roce 2021</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8225782-13-best-clickfunnels-alternatives-in-2021" title="13 NEJLEPŠÍCH alternativ ClickFunnels v roce 2021" rel="bookmark">13 NEJLEPŠÍCH alternativ ClickFunnels v roce 2021</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8225783-23-best-url-shortener-of-2021-free-custom-link-service" title="23 Nejlepší zkracovač URL z roku 2021 (bezplatná služba vlastních odkazů)" rel="bookmark">23 Nejlepší zkracovač URL z roku 2021 (bezplatná služba vlastních odkazů)</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8225784-16-best-website-monitoring-tools-open-source-and-paid-in-2021" title="16 NEJLEPŠÍCH nástrojů pro monitorování webových stránek (otevřený zdroj a placené) v roce 2021" rel="bookmark">16 NEJLEPŠÍCH nástrojů pro monitorování webových stránek (otevřený zdroj a placené) v roce 2021</a></h3> </div> </div> </li><li class="post-list-small__item"> <div> <div> <h3 class="post-list-small__entry-title"><a href="/8225785-10-best-ping-monitoring-tools-and-software-in-2021" title="10 NEJLEPŠÍCH nástrojů pro monitorování Ping & Software v roce 2021" rel="bookmark">10 NEJLEPŠÍCH nástrojů pro monitorování Ping & Software v roce 2021</a></h3> </div> </div> </li> </ul> </div> </div> </div> <p>© Copyright cs.css-code.org, 2025 Smět | <a href="https://cs.css-code.org/about-site" title="O webu">O webu</a> | <a href="https://cs.css-code.org/contacts" title="Kontakty">Kontakty</a> | <a href="https://cs.css-code.org/privacy-policy" title="Zásady ochrany osobních údajů">Zásady ochrany osobních údajů</a>. </p> </div> </div> </footer> <link href="https://css-code.org/template/css/style.min.css" rel="preload" as="style" onload="this.onload=null;this.rel='stylesheet'" /> </body> </html> <script defer src="https://static.cloudflareinsights.com/beacon.min.js/vcd15cbe7772f49c399c6a5babf22c1241717689176015" integrity="sha512-ZpsOmlRQV6y907TI0dKBHq9Md29nnaEIPlkf84rnaERnq6zvWvPUqr2ft8M1aS28oN72PdrCzSjY4U6VaAw1EQ==" data-cf-beacon='{"rayId":"93b4aaf00ee5f60c","version":"2025.4.0-1-g37f21b1","r":1,"serverTiming":{"name":{"cfExtPri":true,"cfL4":true,"cfSpeedBrain":true,"cfCacheStatus":true}},"token":"a52d27ea9cc54e64970d62936c05ab0e","b":1}' crossorigin="anonymous"></script>