var varForm = document.querySelector(’.chat-form’);
var varChat = document.querySelector(’.chat-content’);
var input = document.querySelector(’.chat-form-input’);
var varTemp = document.querySelector(’#message-template’).content;
var message = varTemp.querySelector(’.chat-message’);
var messageRemoover = function (message) {
var remButton = message.querySelector(’.chat-message-button’);
remButton.addEventListener(‘click’, function () {
message.remove();
});
};
varForm.addEventListener(‘submit’, function(evt) {
evt.preventDefault();
var newMessage = message.cloneNode(true);
var text = newMessage.querySelector(’.chat-message-text’);
var name = newMessage.querySelector(’.chat-message-name’)
var value = input.value;
text.textContent = value;
varChat.appendChild(newMessage);
messageRemoover(newMessage);
});
На скриншотах не заметил отличие в поле ввода, после text.textContent = value;
дописал input.value = “”; чтобы обнулить его и там опять появился placeholder
да блин. кароч в след раз присылайте отформатированный код. я где-то кавычку вашу не переделал (форум меняет вид кавычек), думал проблема в удалении сообщения.
а эту ошибку сразу поправил и ппц измучился с удалением сообщения
такая же проблема как описано выше - вроде все работатет но проверку не проходит -
var messagesList = document.querySelector(’.chat-content’);
var messagesItems = messagesList.children;
var addNewMessageForm = document.querySelector(’.chat-form’);
var newMessageItem = addNewMessageForm.querySelector(’.chat-form-input’);
var template = document.querySelector(’#message-template’).content;
var newMessageTemplate = template.querySelector(’.chat-message’);
var closeHandler = function (item) {
var messageCloseButton = item.querySelector('.chat-message-button');
messageCloseButton.addEventListener('click', function () {
item.classList.add('visually-hidden');
});
};
for (var i = 0; i < messagesItems.length; i++) {
closeHandler(messagesItems[i]);
}
addNewMessageForm.addEventListener('submit', function (evt) {
evt.preventDefault();
var messageText = newMessageItem.value;
var message = newMessageTemplate.cloneNode(true);
var messageContent = message.querySelector('.chat-message-text');
messageContent.textContent = messageText;
messagesList.appendChild(message);
newMessageItem.value = '';
closeHandler(message);
});
Интуиция мне подсказывает, что наличие цикла в этом скрипте при количестве 1000 и более сообщений в чате убьёт компьютер пользователя. Я прав? Какие ещё есть методы навешать кнопку удаления?
обработчик закрытия достаточно вешать в момент создания сообщения, т.е. во время срабатывания обработчика “submit”
просто в данном случае мы достаем из кэша старые сообщения и развешиваем на него обработчик (т.е. это история сообщений, а не только что созданная “мессага”). по хорошему это должно происходить в момент подгрузки старых сообщений.
Как вы смогли прийти к такому решению? Я прошёл эти же курсы и например не встречал поиск по id, а вы использовали такой метод. Я хотел сделать задания используя код из обучения. Но там не совпадают html шаблоны)))) По итогу пришлось через ваши ответы разбираться и смотреть как сделать задание
Странно… Я был уверен на 99.9% что вы модератор на этом сайте. Мне кажется это же не логично тратить время просто на форуме, когда вы и так профи и можете просто сайты делать и зарабатывать деньги.
потому что я купил подписку на год =) не бойтесь, через 3 недели подписка кончится и я покину вас. уже учусь в другой школе по фронтэнду, там пожестче все.
я таким образом тренирую внимательность, смотрю где люди ошибаются и там уже не делаю ошибок, а до профи мне далеко, как пешком до парижу. просто на форуме этого не заметно, но на курсах преподают абсолютный мизер от JS. процентов 5% максимум.
