Notice: A session had already been started - ignoring session_start() in /var/www/html/biblioteca/inceput_pag_a.php on line 2
Tehnici Web, proiecte JS

Tehnici Web

Nu esti logat.

Exercitii de baza

Punctele pe aceste exercitii se vor adauga la punctajul de proiect.

  1. Exercitii simple (la nivel de definitie) pentru intelegerea conceptelor de baza

    Unele exercitii vor avea ca rezolvare mai multe fisiere. (De fiecare data cand cerinta incepe cu "pornind de la fisierul..." inseamna ca e vorba de un fisier nou de rezolvare, chiar daca acel fisier de baza a mai fost folosit in subpuncte anterioare.

    Modul de notare:

    1. Invatand din:

      Realizati urmatoarele cerinte:

      1. Pornind de la aceasta pagina html, la incarcarea paginii sa se insereze inaintea paragrafului cu id-ul p1 un paragraf cu textul "EU sunt primul!!!!"
      2. Pornind de la aceasta pagina html, la fiecare click pe buton sa se insereze un paragraf exact inaintea butonului, cu numarul sau de ordine (al catelea a fost generat).
      3. Pornind de la aceasta pagina html, la fiecare click pe buton sa se insereze un paragraf la inceputul paginii (deci, atentie, nu neaparat inaintea butonului si inaintea primului element din pagina), cu numarul sau de ordine (al catelea a fost generat).
    2. Invatand din:

      Realizati urmatoarele cerinte:

      1. Pornind de la aceasta pagina html, la incarcarea paginii sa se schimbe continutul paragrafului, cu un numar random.
      2. Pornind de la aceasta pagina html, la incarcarea paginii sa se deschida un prompt in care utilizatorul sa scrie ceva. Acel ceva va deveni continutul paragrafului din pagina.
      3. Pornind de la aceasta pagina html, se vaa defini un vector variabila globala cu continutul ["miau","chit","oac","cip","ham","Bun ziua, cumetre","bee"]. La deschiderea paginii continutul paragrafului din pagina va fi sirul egal cu un element aleator din vector, concatenat cu semnul exclamarii (de exemplu "bee!").
    3. Invatand din:

      Realizati urmatoarele cerinte:

      1. Pornind de la aceasta pagina html, la click pe buton sa se adauge la sfarsitul paginii un paragraf cu textul luat din inputul de tip text.
      2. Pornind de la aceasta pagina html, la click pe buton
        • daca nu exista un paragraf deja, la sfarsitul paginii, atunci sa se adauge un paragraf nou la sfarsitul paginii cu textul luat din inputul de tip text
        • iar daca exista deja un paragraf la sfarsitul paginii, sa se adauge in textul sau continutul inputului.
      3. Pornind de la aceasta pagina html, la click pe buton,
        • daca nu exista o lista deja, la sfarsitul paginii, atunci sa se adauge o lista noua (ol sau ul, e alegerea voastra) la sfarsitul paginii cu un singur element cu textul luat din inputul de tip text
        • iar daca exista deja o lista la sfarsitul paginii, sa se adauge la sfarsitul sau un element nou cu textul preluat din valoarea inputului.
    4. Invatand din:

      Realizati urmatoarele cerinte:

      1. Pornind de la aceasta pagina html, la incarcarea paginii sa se afiseze in divul cu id-ul "info" care sunt tagurile fiilor(elemente) lui body.
      2. Pornind de la aceasta pagina html, la incarcarea paginii sa se afiseze in divul cu id-ul "info" cati fii ai lui body sunt textNode si care e valoarea lor (fiecare valoare afisata pe un rand nou), respectiv cati fii ai lui body sunt elemente si care e innerHTML-ul lor.
      3. (valoreaza cat 2 subpuncte) Pornind de la aceasta pagina html Sa se adauge la sfarsitul fiecarui element li cate un textNode, continand fi valoarea "textNode" daca li-ul contine un textNode, fie numele tagului, daca li-ul contine un element.
    5. Invatand din:

      Exercitiul cu localStorage Realizati urmatoarele cerinte:

      1. (0.3) Pornind de la aceasta pagina html, sa se scrie direct in body de cate ori a fost deschisa pagina (salvand in localStorage acest numar). Sa se creeze dinamic un buton, la sfasitul paginii cu textul "sterge", care sterge continutul localStorage-ului.
      2. (1.5) Porniti de la aceasta pagina html.
        1. La selectarea unui nume de imagine din selectul simplu, imaginea cu id-ul "imag" isi va schimba src-ul cu valoarea optiunii selectate.
        2. De asemenea, cand se bifeaza un anumit radiobutton, imaginea va capata un border cu culoarea indicata in valoarea radiobutton-ului.
        3. In urma schimbarilor de mai sus, noul src si borderul vor fi salvate in localStorage.
        4. La reincarcarea paginii, imaginea va avea src-ul si borderul preluate din localStorage (deci va arata asa cum a fost la incarcarea paginii), iar selectul si radiobuttonurile vor avea selectiile facute astfel incat sa coincida cu starea imaginii (in select sa fie selctat src-ul curent al imaginii, si sa fie bifat radiobutton-ul corespunzator culorii borderului).
        5. La ctrl+click pe imagine se sterge borderul imaginii, atat din pagina cat si din localStorage (daca dupa asta se inchide si redeschide pagina, imaginea nu va mai avea border si niciun radiobutton nu va mai fi bifat). Dar la o selectare ulterioara a unui radiobutton, imaginea isi va recapata borderul
      3. (0.7) Pornind de la pagina cu trei butoane. La click pe butonul rosu se va genera un div de culoare rosie (background), la click pe butonul albastru, un div de culoare albastra, la click pe cel verde un div verde. Toate divurile vor avea clasa "patratel". Se pot genera astfel mai multe divuri din cele 3 tipuri, facand click succesiv pe butoane. Se va memora in localStorage o informatie care sa descrie divurile generate astfel incat la reincarcarea paginii sa se afiseze divurile create inainte de a fost inchisa pagina. Cand suntem cu cursorul pe un div, daca apasam tasta "s" divul va fi sters si din pagina si din localStorage. La dublu-click in fereastra se sterg toate divurile din pagina si e stearsa si informatia lor din localStorage