Advertisement
petur_stoqnov

Untitled

Feb 17th, 2021
826
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. function solution() {
  2.     let input = document.querySelector('input[type="text"]');
  3.     let btnInput = document.querySelector('button');
  4.     // взимам само ul списъците, за да работя с тях
  5.     let uls = Array.from(document.querySelectorAll('ul'));
  6.  
  7.     btnInput.addEventListener('click', (e) => {
  8.         e.preventDefault()
  9.         let li = factory('li', input.value, 'gift')
  10.         let sendBtn = factory('button', 'Send', 'sendButton')
  11.         let discardBtn = factory('button', 'Discard', 'discardButton')
  12.         li.appendChild(sendBtn);
  13.         li.appendChild(discardBtn);
  14.         uls[0].appendChild(li)
  15.         sortUl(uls[0]);
  16.         input.value = "";
  17.         // задължително трябва да е () => иначе хваща само текущия this (е) и директно ще изпълни функцията
  18.         // важно е да подавам ul списъка в който трябва да го преместя и li,  само като референция на this за специфичния
  19.         // html елемент
  20.         sendBtn.addEventListener('click', () => move(li, uls[1]))
  21.         discardBtn.addEventListener('click', ()=> move(li, uls[2]))
  22.     })
  23.  
  24.     // Фактори функция за местене
  25.     function move(li, uls){
  26.         // тук вместо button мога да напиша всеки елемент който искам да премахна
  27.         let arr = Array.from(li.querySelectorAll('button'));
  28.         arr.forEach(e=>e.remove());
  29.         uls.appendChild(li)
  30.     }
  31.  
  32.    // Фактори функция за сортиране
  33.     function sortUl(ul) {
  34.         const elem = factory('li', 'content', 'gift')
  35.         console.log(elem);
  36.         // ако искам да е на определна позиция винаги,вместо сорт
  37.        Array.from(ul.getElementsByTagName("LI"))
  38.             .sort((a, b) => a.textContent.localeCompare(b.textContent))
  39.             .forEach(li => ul.appendChild(li));
  40.         console.log(ul);
  41.     }
  42.  
  43.     // фактори функция за създаване на елемент
  44.     function factory(type, content, className, attribute, attributeValue) {
  45.         const result = document.createElement(type);
  46.         result.textContent = content;
  47.         if (className) {
  48.             result.classList.add(className)
  49.         }
  50.         if (attribute) {
  51.             result.setAttribute(attribute, attributeValue)
  52.         }
  53.         return result;
  54.     }
  55.  
  56. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement