OPAKOVÁNÍ ČÍSLIC V JS PHP

Zadání:
Vypište, řadu čísel od 1 do 100, která budou měnit svůj vzhled v závislosti na hodnotě.

Prvně vždy vytvoříme HTML div, kterému dáme id. Do divu budeme později vypisovat výstup.

JavaScriptový kód vždy začínáme otevíracím tagem scriptu(<script>), ukončujeme ho uzavíracím tagem scriptu (</script>).

Vytvoříme prázdnou proměnnou fontsize, se kterou budeme později pracovat. Dále pak vytvoříme proměnnou zprava, do které vložíme prázdné uvozovky.

Nyní použijeme cyklus FOR(). Cyklus nastavíme od jedničky a počet opakování na 100. Do něj pak vložíme podmínku if(). V ní se bude vyhodnocovat velikost fontu čísla. Když bude i menší než padesát, číslo se bude zvětšovat zároveň s hodnotou i. V opačném případě se bude zmenšovat. Toho docílíme odčtením zvětšující se hodnoty i od čísla 101.

Nakonec vytvořené HTML elementy přidáme do zprava, v CSS stylu použijeme i. Později pak samotné i vložíme do textu, což nám promítne číslo samotné.

Nakonec zprávu vložíme do HTML divu.

<div id="cisla"></div>

<script>
    let fontsize;
    let zprava = "";

    for (let i = 1; i <= 100; i++) {
        if (i <= 50) {
            fontsize = i;
        }
        else {
            fontsize = 101 - i;
        }

        zprava += "<span style=\"color: rgba(225," + (i*2) + "," + (i*2) + ",1); font-size: " + (fontsize + 12) + "px;\">" + i + "</span> ";
    }
    document.getElementById("cisla").innerHTML = zprava;
</script>