Не работает замена элементов на фрагмент
 

Друзья, почему не работает этот код:

let tt = document.getElementById("1234");
let frag = document.createDocumentFragment();
frag.innerHTML = tt.innerHTML;
tt.replaceWith(frag);

Элемент удаляется и все...

У фрагмента нет свойства innerHTML.

Не очень понятно, что ты тут вообще пытаешься сделать и зачем?

Так чтобы работало, это можно сделать подобным образом:

let tt = document.getElementById("1234");
tt.outerHTML = tt.innerHTML;

но это очень плохой код, т.к потеряются все обработчики на детях.

Код по-лучше так(но всё ещё не понятна цель):

let tt = document.getElementById("1234");
let frag = document.createDocumentFragment();
frag.append(...tt.childNodes);
tt.replaceWith(frag);

или, проще, так:

let tt = document.getElementById("1234");
tt.replaceWith(...tt.childNodes);

Благодарю за ответ! Мне нужно удалить родительский элемент, оставив его содержимое, например:

<div><p>text</p></div>
<div>text</div>

Ещё можно через css сделать элементу:

display: contents;

удалён он не будет, но вести себя станет так как будто его нет.:)

Нет, так не подходит мне.. Дело в том, что я пишу небольшой редактор текста, у которого ограниченный набор стилей, ну то есть можно сделать только пару заголовков, курсив, жирный и подчеркнутый, примерно так и есть кнопка "сделать простым текстом"... Все это в редактируемом контейнере DIV, отправляется AJAXом на сервер и там уже парсится HTML-код...

Все бы отлично, но хочется сделать все по уму и защиту от дураков, это когда выделяют половину заголовка и половину другого тега, приходится их изменять на простой текст, как правило целиком... Вот и получается у меня на выходе тег HTML, из которого нужно выдергнуть все содержимое и поставить вместо этого тега..

Так еще можно

let tt = document.getElementById("1234");
tt.before(...tt.childNodes);
tt.remove();