Сохранить расположение дерева dom элементов в localStorage

При перемещении веток дерева dom элементов относительно друг друга, нужно запомнить это, т.е. записать в localStorage. Блоков с классом block_edit много, Неужели придется всю страницу запоминать???

// Ищем блоки в iframe с классом block_edit для его выделения/фокусировки
let blockEdit = $(this).contents().find('.block_edit');
// перебираем в цикле найденные блоки
$.each(blockEdit, function(index, value) {
    (function($){
        $(value).on('click', function(e) {
            e.stopPropagation();
            $(this).toggleClass('block_editor');
            let blockMove = $(this);
            $('.block_down').click(function() {
                // Переместили и записали в localStorage
                blockMove.next().insertBefore(blockMove);
            });
            $('.block_up').click(function() {
                // Переместили и записали в localStorage
                blockMove.prev().insertAfter(blockMove);
            });
        });
        $(value).hover(function(e) {
            e.stopPropagation();
            $(this).css('border', '3px dashed #478500');
        }, function(e){
            e.stopPropagation();
            $(this).removeAttr('style');
        });
    })(jQuery);
});

Пробовал так:

// Записываем html элемент в localStorage
localStorage.setItem('html' + index, $(blockMove).html());

// Получаем измененный элемент из localStorage
let geHtml = localStorage.getItem('html' + index);
    if(geHtml) {
        $(blockMove).html(getText);
    }

Но это записывает только перемещенный блок, а страница то не знает его положение относительно других!


Ответы (0 шт):