Diskuze: Datum -> kód zjednodušit, css styly

Naučíme tě pracovat na home-office.

Zjistit více...

V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.

Aktivity

Qestin

Člen

Qestin:15.11.2016 16:45

Zdravím,

mohl by mi někdo poradit?

1.) Potřeboval bych tento kód zjednodušit, nejspíš pomocí, některé funkce?
2.) Potřeboval bych, aby každý sudý den byl barvou "červenou" a každý lichý den barvou "modrou" to, ale provést v css souboru styly?

Děkuji za jakékoliv rady. Přeji pěkný večer. :-)

code]
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>

<div class="time1"><script>
x=new Date();
x.setTime(x.getTime() + 0 2460601000);
month = x.getMonth() + 1;
date = x.getDate();
year = x.getFullYear();
document.write("Dnes je: " + date + ". " + month + ". " + year);
</script></div>

<div class="time2"><script>
x=new Date();
x.setTime(x.getTime() + 1 2460601000);
month = x.getMonth() + 1;
date = x.getDate();
year = x.getFullYear();
document.write("Zítra bude: " + date + ". " + month + ". " + year);
</script></div>

<div class="time3"><script>
x=new Date();
x.setTime(x.getTime() + 2 2460601000);
month = x.getMonth() + 1;
date = x.getDate();
year = x.getFullYear();
document.write("Pozítří bude: " + date + ". " + month + ". " + year);
</script></div>

</body>
</html>

\---

Odpovědět

15.11.2016 16:45

Michal

Člen

Michal:15.11.2016 18:45

Jde to zkrátit třeba tak, že si vytvoříš funkci, která k aktuálnímu datu připočte určitý počet dní a pak už budeš volat pouze tu funkci, tzn. výpočet nebudeš muset psát na více místech najednou:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" type="text/css" href="css/style.css">
    </head>
    <body>
        <script>
            function zjistiDatum(dnyNavic) {
                var konecneDatum = new Date();
                konecneDatum.setDate(konecneDatum.getDate() + dnyNavic);
                return konecneDatum.getDate() + '. ' + (konecneDatum.getMonth() + 1) + '. ' + konecneDatum.getFullYear();
            }
            document.write('<div class="time1">Dnes je: ' + zjistiDatum(0) + '</div>');
            document.write('<div class="time2">Zítra bude: ' + zjistiDatum(1) + '</div>');
            document.write('<div class="time3">Pozítří bude: ' + zjistiDatum(2) + '</div>');
        </script>
    </body>
</html>

Liché a sudé prvky lze odlišit jednoduchým selektorem:

/** Každý sudý <div> bude červeným písmem. */
div:nth-of-type(2n) {
   color: red;
}

/** Každý lichý <div> bude modrým písmem. */
div:nth-of-type(2n + 1) {
   color: blue;
}

Akceptované řešení
+20 Zkušeností
+2,50 Kč

Nahoru Odpovědět

15.11.2016 18:45

Qestin

Člen

Qestin:15.11.2016 18:58

To je přesně ono, moc děkuji

Nahoru Odpovědět

15.11.2016 18:58

Libor Šimo (libcosenior)

Tvůrce

Libor Šimo (libcosenior):16.11.2016 8:17

Alebo takto:

/** Každý sudý <div> bude červeným písmem. */
div:nth-of-type(even) {
   color: red;
}

/** Každý lichý <div> bude modrým písmem. */
div:nth-of-type(odd) {
   color: blue;
}

Nahoru Odpovědět

16.11.2016 8:17

Aj tisícmíľová cesta musí začať jednoduchým krokom.

Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 4 zpráv z 4.

Nejčastěji vyhledáváné

Diskuze: Datum -> kód zjednodušit, css styly