Испытание: Список задач

Написал код, а консоль ругается: строка 17 позиция 34 Где ошибка , не наблюдаю.
let list = document.querySelector(’.todo-list’);
let input = document.querySelector(’.todo-input’);
let form = document.querySelector(’.todo-form’);
let priority = document.querySelector(’.todo-priority’);

priority.onclick = function () {
priority.classList.toggle(‘is-important’);
if (priority.classList.contains(‘is-important’)) {
priority.textContent = ‘Важная задача’;
} else {
priority.textContent = ‘Обычная задача’;
}
};

form.onsubmit = function (evt) {
evt.preventDefault();
let task = document.createElement(‘li’);
task.textContent = input.value;
if (priority.classList.contains(‘is-important’)) {
task.classList.add(‘is-important’);
} else {
task.classList.remove(‘is-important’);
}
list.append(task);
input.value = ‘’;
}

Добрый день!
Протестировала ваш код, всё идеально работает.


Приложите, пожалуйста, скриншот страницы, посмотрим, из-за чего ругается консоль.

Я на скрине видны кавычки не правильные я их заменил на нужные

После изменения кавычек код заработал?

Вообще ругаться начал :frowning:

В первоначальном вашем коде, который у меня сработал полностью, в 17 строке
let task = document.createElement(‘li’);
li в кавычках :slightly_smiling_face:

Огромное спасибо :slight_smile:

1 лайк

Объясните мне пожалуйста как строится смысл этой строки кода:
let task = document.createElement(‘li’);
Создаем переменную task со значением создать элемент list item?
Где здесь логика???
Как значение переменной может быть командой?

Создаём новый элемент li и записываем его в переменную task

Подробнее в Условия и создание элементов 10/16 ( Метод createElement, создание элемента) описано.

Здравствуйте, подскажите пожалуйста, что не так в коде?

А можно ли обойтись в этом задание без создания переменной?

Я вижу только такой вариант, или есть что-то проще?

  list.append(document.createElement('li'));
  document.querySelector('li:last-child').textContent = input.value;
  if(priority.classList.contains('is-important')){
    document.querySelector('li:last-child').classList.add('is-important');
  }
  input.value = '';

И второй вопрос, возможно ли операцию с 1 строчки и 2 строчки совместить, или они должны идти обязательно раздельно?
такой вариант выдает ошибку, видимо из-за знака равно

list.append(document.createElement('li').textContent = input.value)

et list = document.querySelector(’.todo-list’);
let input = document.querySelector(’.todo-input’);
let form = document.querySelector(’.todo-form’);
let priority = document.querySelector(’.todo-priority’);

priority.onclick = function () {
priority.classList.toggle(‘is-important’);
if (priority.classList.contains(‘is-important’)) {
priority.textContent = ‘Важная задача’;
} else {
priority.textContent = ‘Обычная задача’;
}
};

form.onsubmit = function (evt) {
evt.preventDefault();
let task = document.createElement(‘li’);
task.textContent = input.value;
if (priority.classList.contains(‘is-important’)){
task.classList.add(‘is-important’);}
else {task.classList.remove(‘is-important’);}
list.append(task);
input.value=’’;
};
Почему выдает ошибку TypeError : list.append is not a function

у меня вроде работает, но не проходит тест. почему?

let list = document.querySelector('.todo-list');
let input = document.querySelector('.todo-input');
let form = document.querySelector('.todo-form');
let priority = document.querySelector('.todo-priority');

priority.onclick = function () {
  priority.classList.toggle('is-important');
  if (priority.classList.contains('is-important')) {
    priority.textContent = 'Важная задача';
  } else {
    priority.textContent = 'Обычная задача';
  }
};

    form.onsubmit = function (evt) {
      evt.preventDefault();
          
      let li = document.createElement('li');
      
      if(priority.classList.contains('is-important')){
        li.classList.add('is-important');
      }else{
        li.classList.remove('is-important')
      }
        li.textContent = input.value;
  input.value = '';
  list.append(li);
  
  
};

скажите что не так а то он последнюю задачу не принимает:

let list = document.querySelector(’.todo-list’);
let input = document.querySelector(’.todo-input’);
let form = document.querySelector(’.todo-form’);
let priority = document.querySelector(’.todo-priority’);

priority.onclick = function () {
priority.classList.toggle(‘is-important’);
if (priority.classList.contains(‘is-important’)) {
priority.textContent = ‘Важная задачa’;
} else {
priority.textContent = ‘Обычная задача’;
}
};

form.onsubmit = function (evt) {
evt.preventDefault();
let form = document.createElement(‘li’);
list.append(form);
form.textContent = input.value;
input.value =’’;

if(priority.classList.contains('is-important')){
form.classList.add('is-important');
} else {form.classList.remove('is-important');
};

};

100% Коротко и чётко!

let list = document.querySelector(’.todo-list’);
let input = document.querySelector(’.todo-input’);
let form = document.querySelector(’.todo-form’);
let priority = document.querySelector(’.todo-priority’);

priority.onclick = function () {
priority.classList.toggle(‘is-important’);
if (priority.classList.contains(‘is-important’)) {
priority.textContent = ‘Важная задача’;
} else {
priority.textContent = ‘Обычная задача’;
}
};

form.onsubmit = function (evt) {
evt.preventDefault();
let task = document.createElement(‘li’);
task.textContent = input.value;
if (priority.classList.contains(‘is-important’)) {
task.classList.add(‘is-important’);
};
input.value = ‘’;
list.append(task);
};