Третья программа: «Мессенджер»

Курсы Манипуляции с DOM
1

Помогите, пожалуйста! После нажатия на крестик, что бы удалить сообщение в консоль выводится TypeError : message.remove is not a function и сообщение не удаляется…
Вот мой код:

var messageTemplate = document.querySelector('#message-template').content;
var messageForm = document.querySelector('.chat-form');
var messageInput = messageForm.querySelector('.chat-form-input');
var messenger = document.querySelector('.chat-content');

var addDeleteAbility = function (message) {
  var messageDeleteButton = message.querySelector('.chat-message-button');
  messageDeleteButton.addEventListener('click', function(){
    message.remove();
  });
};


messageForm.addEventListener('submit', function(evt){
  evt.preventDefault();
  
  var messageText = messageInput.value;
  var message = messageTemplate.cloneNode(true);
  var messageContent = message.querySelector('p');
  messageContent.textContent = messageText;
  addDeleteAbility(message);
  
  messenger.appendChild(message);
  messageInput.value='';
});
2

После того, как вы нашли messageTemplate, нужно ещё внутри него (это #document-fragment) найти элемент .chat-message. И уже его клонировать при создании нового сообщения message. Сейчас у вас в message находится #document-fragment, это можно увидеть, выведя его через console.log. После исправления проверка пройдёт.

1 лайк