[JavaScript UI & DOM] Задачи за подготовка за изпит


41

Здравейте колеги,

Качил съм в системата задачи за подготовка за предстоящия изпит по "JavaScript UI & DOM 2014", който ще се проведе на 17 юни 2014 г. Може да ги свалите и от условие и допълнителни файлове. Задачите носят различен брой точки, тъй като в никакъв случай не са еднакви по сложност. Максималният резултат от изпита е 200т. (100т. + 60т. + 40т.)
Задачите са както следва:
Първа задача - създаване на уеб компонент с чист (vanilla) JavaScript - носи 100т.
  • Да се напише уеб контрола с чист JavaScript (на задачата за подготовка е календар)
  • Всички стилове се задават с JavaScript
    • Не са позволени CSS файлове или въобще писане на какъвто и да е CSS (освен този, който се генерира с node.style)
Втора задача - jQuery plugin - носи 60т.
  • Да се напише добавка (plugin) за jQuery (на задачата за подготовка е Tabs)
  • Дадените HTML и CSS файлове не се променят, променя се само JavaScript файла (scripts.js)
Трета задача - Шаблони с Handlebars.js - носи 40т.
  • Напишете шаблони на Handlebars.js, които да възпроизведат дадения в results.html HTML код
  • Дадените CSS и JavaScript файлове не се променят, както и HTML, освен в script таговете с type='text/x-handlebars-template'
И трите задачи ще ги решаваме на живо в четвъртък и петък и ще запишем видеа и решения.
 
Поздрави,
 
Дончо Минков



Отговори



0

Ето я моята първа задача - тук.

Направил съм си по един <div> за всеки ден като датата ми е в <p> таг. Задал съм им float наляво, така че се пренераждат в зависимост от това колко е широка страницата. Като се цъкне на някой елемент за втори път му премахвам селекцията и става нормален. Това е по-интересното май.


от lostm1nd (846 точки)


1
Най-после успях да реша календара :) Получи се 80 реда, от които 15 реда стилизиране, така че съм доволен :)
 

от neutrino (3376 точки)


0
Браво много добро решение, то дори на подготовката нямаше такова.

от achoraev (467 точки)


0

Малко извън темата, но покрай подготовката си поиграх с cloneNode, documentFragment и обикновен html елемет, който се ползва за контейнер. Разбира се и "забранения" начин с апенд на всеки елемент. Код може да се види тук - http://jsfiddle.net/PHQpf/

Питането ми е кой е оптималния вариянт за добавяне в този случай. Функциите са четири.

1. Simple() - най-бавно

2. cloneNode  ?

3. cloneNode + documentFragment

4. cloneNode + simple html element

Резултатите за време може да се видят в конзолата. Питам, защото всеки път ми се получават различни резултати за вариантите от 2 до 4.


от deyan.todorov (1019 точки)


0
Не мога да ти дам отговор, но най-добре направи тестовете през jsperf

от Vazzzz (1380 точки)

0
Не знам дали успях правилно да наглася теста, но се получиха едни резултати :) - http://jsperf.com/dom-append-test-performance

от deyan.todorov (1019 точки)



0

 Ето вариант на първа задача: 

http://jsfiddle.net/wFNB4/

Искам само да попитам, защо ако закачам event-ите от 41-ви ред, не работят. Обяснявам си, че може би защото елементите селектирани на 42-ри ред още не съм в ДОМ дървото, но пък при първото извикване на функцията със сигурност са...


от ivan.mihov1 (4988 точки)


0
Клонирането на обектите маха евентите. Затова изчезват. Не можеш да клонираш евентите

от Vazzzz (1380 точки)

0
Мерси. Това не го подозирах

от ivan.mihov1 (4988 точки)