HTML input mező típusok

 

Javascript shorthand megoldások

 

Készíts egy jelszógenerátort Javascript segítségével!

 Az elkészült weboldal megjelenése a következő legyen :

Egyszerű szürke háttér, az input mezőket tartalmazó konténer kerüljön az oldalon középre. Használd a labal tag-eket is az input mezőkhöz. 

A jelszó csak a bejelölt checkbox-ok szerint generálja le az új jelszót a megadott hosszúságban.

Egy kis segítség, hogy ezeket ne kelljen begépelned:

    let lowercase = 'abcdefghijklmnopqrstuvwxyz';

    let uppercase = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';

    let numbers = '0123456789';

    let symbols = '!@#$%^&*_=+-/.?<>)';

Adatok beolvasása tömbből és rendezés kattintásra

 Írj egy Javascript kódot, amely megjeleníti a következő adatokat a weboldalon:

let webAppsData = [

    {"name": "Google Search", "users": "2 Billion"},

    {"name": "YouTube", "users": "1.9 Billion"},

    {"name": "Facebook", "users": "2.8 Billion"},

    {"name": "Gmail", "users": "1.5 Billion"},

    {"name": "WhatsApp Web", "users": "2 Billion"},

    {"name": "Amazon", "users": "300 Million"},

    {"name": "Twitter", "users": "330 Million"},

    {"name": "Zoom", "users": "300 Million"},

    {"name": "LinkedIn", "users": "740 Million"},

    {"name": "Google Drive", "users": "1 Billion"}

];

Képernyő nézet:

Az elrendezéshez használj Bootstrap-et! 

A kék gombra kattintva rendezze az adatokat a legtöbb felhasználó szerinti sorrendben, a zöld gombra kattintva pedig a legkevesebb felhasználó szerinti sorrendben.

Őszi szünet házi feladat

 Készíts egy single-page weboldalt, amely a következőket tartalmazza:

1.      Tartalmazzon az oldal egy menüt;

2.      Paragrafusokat, behúzással, sorköz távolsággal, sorkizártan;

3.      listákat (számozott, számozatlan);

4.      külső fájlban csatolj az oldalhoz javascript fájlt;

5.      valamelyik listához lehessen hozzá adni új elemet, vagyis helyezz el alatta egy input beviteli mezőt, amelybe ha a szöveget beírunk, megjelenik a lista elemek után; (javascript)

6.      próbáld meg megoldani, hogy ne lehessen hozzá adni a listához újra ugyanazt a szöveget;

7.      képeket;

8.      linkeket;

9.      űrlapot legalább 4 féle input beviteli mezővel;

10.   az űrlap kötelező elemeit emeld ki valamilyen módon;

11.   azonosító alapú formázást (id);

12.   osztály alapú formázást (class);

13.   legalább egy elem, változzon meg amikor fölé visszük az egeret (hover);

14.   legalább egy paragrafus első sora nézzen ki más formátumban (betűszín, stílus stb.)

15.   javascripttel végezd el az űrlap validációját;

16.   tartalmazzon az oldal táblázatot is;

17.   a táblázatban legyen cella összevonás is;

18.   a táblázat minden sora más háttérszínű legyen;

19.   validált az oldalad html és css kódját; készíts a validálásról képernyő képet;

20.   A kódod tartalmazzon kommenteket.

21.   Készíts dokumentációt az oldaladhoz. (Cím; alcímek ha szükséges, word-ben TimesNewRoman 12pt; másfeles sorkizárással; felhasznált technológiák; oldal felhasználói leírása; majd fejlesztői dokumentáció. Forrásokat jelöld!!! Lehet lábjegyzetben is. (Erre külön jegyet kapsz.)

Js gyak2

 Készíts egy egyszerű weboldalt a következő tartalommal: 

Írj hozzá scriptet, ha a felhasználó beír két számot, akkor a Számol gombra kattintva megjelenik az eredmény:

Js gyak1

 Készíts egy weboldalt, amelyen egy gomb kerül elhelyezésre, amelyre ha kattintunk az alatta lévő html elemben megjelenik a "Hello Világ" felirat!