Dz8_zagotovka

by SamokhinDmitro_33JS

HTML

<input type="text" id="myInput">
<button id="btnClick">Добавить событие</button>

<button id="table">Создадим таблицу</button>

JavaScript

/*Создать
 input и button с текстом "Добавить задачу" +
3. По нажатию на кнопку "Добавить задачу", в таблице должна появляться запись (в одной ячейке) - задача (тег <p>),
2 кнопки (Выполнено / Не выполнено). Фоновый цвет желтый.
При нажатии на кнопку "Выполнено" - фон меняется на зеленый, кнопки исчезают.
При нажатии на "Не выполнено" кнопки исчезают фон становиться красным.
4. Возможность добавления задач должна быть не ограничена. +
 */

var input = document.getElementById('myInput');
var btn = document.getElementById('btnClick');

btn.addEventListener('click', task);


// ф-кция создания задачи
function task(){
            if(input.value.length!==0){
                var paragraph = document.createElement('p');
                paragraph.id = 'task';
                paragraph.style.width='150px';
                paragraph.className = 'classTask';
                paragraph.style.border = '2px solid black';
                paragraph.fontSize = '24px';
                paragraph.color = 'blue';
                paragraph.style.background='yellow';
                paragraph.innerText = input.value;
                document.body.appendChild(paragraph);
              // return this.paragraph;
            }
            
          
}

//taskValue();


//ф-кция выполнения/невыполнения задач; оформить через callback

function taskValue(){
    var p = document.getElementById('task');
    var btnTrue = document.createElement('button');
    var btnFalse = document.createElement('button');

    //Описываем кнопку true
    btnTrue.id='btnTrue';
    btnTrue.textContent='Задача выполнена';

    //Описываем кнопку false
    btnFalse.id='btnFalse';
    btnFalse.textContent='Задача невыполнена';


    p.appendChild(btnTrue);  //неотрабатывает
    p.appendChild(btnFalse);  //неотрабатывает


    //Обработчик событий кнопок
    btnTrue.addEventListener('click', function(){
        p.style.background='green';
    });

    btnFalse.addEventListener('click', function(){
       ...