Как вставить пользовательский тег или изображение внутри contentEditable div с помощью JavaScript?

#javascript #html #css

#javascript #HTML #css

Вопрос:

В stackoverflow уже есть ответ, в котором использовалась функция execCommand(). Но, как мы все знаем, execCommand устарел (ДОКУМЕНТАЦИЯ)

Итак, как я могу что-либо изменить или добавить или модифицировать текст или содержимое внутри contentEditable div? Насколько я знаю medium.com CKEditor и многие другие редакторы используют contentEditable для создания редактора. Как они изменяют свое содержимое?

Это должно работать как текстовый редактор, выделите любой конкретный текст, а затем измените / модифицируйте или вставьте в него новые элементы. [Цель обучения]

 <div contenteditable="true">
  Bold text, italic text, insert images, Heading text, etc
</div>