Привет!
Помогите, пожалуйста, разобраться с ситуацией:
Есть органайзер, в который можно добавить события, указать участников этого события и добавить его описание. Это события сохраняются в localStorage и хранятся там в виде объекта.
Каким образом сделать так, чтобы при перезагрузке страницы (или при переходе на другой месяц, например) введённые данные отображались в нужной ячейке?
if(localStorage.events) {
var existEvents = JSON.parse(localStorage.getItem('events'));//Событие, его дата, участники и описание
var checkCell = document.getElementsByTagName('td');
for(n=0; n<checkCell.length; n++) {
var compareCell = checkCell[n].getAttribute('data-cell');//Cells date Attribute
for(i=0; i<existEvents.length; i++) {
var item = existEvents[i];
if(item.Date == compareCell) {//Если дата совпадает с аттрибутом ячейки, то выводим сохранённое обытие + его участников + описание
var showEvent = checkCell[n].getElementsByClassName('spanEvent'),
showParticipants = checkCell[n].getElementsByClassName('spanParticipants'),
showDescription = checkCell[n].getElementsByClassName('spanDescription');
showEvent.innerHTML = item.Event;
showParticipants.innerHTML = item.Participants;
showDescription.innerHTML = item.Description;
console.log(showEvent, showParticipants, showDescription)
};
};
};
};
Код
showEvent.innerHTML = item.Event;
showParticipants.innerHTML = item.Participants;
showDescription.innerHTML = item.Description;
не работает так, как я ожидаю, т.е., не выводит сохранённые данные в положенное место в ячейке.
Консоль на каждое событие выдаёт массив типа:
[span.spanEvent, innerHTML: "Scooter gig", item: function, namedItem: function] [span.spanParticipants, innerHTML: "Rave guys", item: function, namedItem: function] [span.spanDescription, innerHTML: "Dancing to the floor", item: function, namedItem: function]
Каким образом из этого массива вытянуть данные тегов <span>, чтобы они отображались по умолчанию в ячейке и оставались там после перезагрузке / обновления страницы?
