Для реализации данной доработки приложения "Список задач" необходимо внести следующие изменения в код: 1. Скрывать блок списка задач целиком, если задач в списке нет: - Проверяем, есть ли задачи в списке. Если список задач пустой, то скрываем блок списка с помощью CSS-свойства display: none. - Добавляем проверку наличия задач перед выводом списка.

javascript

function renderTasks(tasks) {

  const taskList = document.getElementById("task-list");



  // Проверяем, есть ли задачи в списке

  if (tasks.length === 0) {

    taskList.style.display = "none";

    return;

  } else {

    taskList.style.display = "block";

  }



  // Выводим список задач

  taskList.innerHTML = "";



  for (const task of tasks) {

    const taskItem = document.createElement("li");

    taskItem.innerText = task;

    taskList.appendChild(taskItem);

  }

}

2. Добавление заголовка списка: - Добавляем входной параметр `title` в функцию `renderTasks()`. - Создаем элемент `h2` с заголовком списка и добавляем его перед списком задач. - Устанавливаем заголовок "Завершённые задачи" для списка завершенных задач.

javascript

function renderTasks(tasks, title) {

  const taskList = document.getElementById("task-list");



  // Проверяем, есть ли задачи в списке

  if (tasks.length === 0) {

    taskList.style.display = "none";

    return;

  } else {

    taskList.style.display = "block";

  }



  // Добавляем заголовок списка, если параметр title передан

  if (title) {

    const listTitle = document.createElement("h2");

    listTitle.innerText = title;

    taskList.parentNode.insertBefore(listTitle, taskList);

  }



  // Выводим список задач

  taskList.innerHTML = "";



  for (const task of tasks) {

    const taskItem = document.createElement("li");

    taskItem.innerText = task;

    taskList.appendChild(taskItem);

  }

}

Теперь мы можем использовать функцию `renderTasks()` с двумя параметрами: массив задач и заголовок. Пример использования функции:

javascript

const tasks = ["Task 1", "Task 2", "Task 3"];

const completedTasks = ["Completed Task 1", "Completed Task 2"];



// Рендерим список незавершенных задач без заголовка

renderTasks(tasks);



// Рендерим список завершенных задач с заголовком

renderTasks(completedTasks, "Завершённые задачи");

Теперь блок списка задач будет скрыт, если задач нет. А для списка завершенных задач будет отображаться заголовок "Завершённые задачи".