Как каждую часть текста переместить в отдельный объект?

Question

[saalaus]

Пишу свой текстовый редактор на contenteditable, и столкнулся с проблемой, мне нужно каждую часть текста переместить в отдельный объект, причем нужно учитывать тэги, как такое сделать?
Например вот такой текст набирает пользователей, и какой объект должен получиться:

Всем привет, это мой <b>текстовый</b> редактор

{
"text1": {
 "text" : "Всем привет, это мой"
}
"text2": {
 "text" : "текстовый"
 "bold" : true
}
"text3": {
 "text" : "редактор"
}
}

то есть, в 1 объекте у нас 1 часть текста, который идет как обычный текст, в теге div с contenteditable, а во втором объекте уже следующий текст, но который находиться в теге b, и дальше, в третьем объекте, остальной текст.

Comments

[Ihor Bratukh]

Может попробуете CodeMirror, там куда больше функционала, чем вы сможете написать.

Answer 1

[ⓒⓢⓢ]

можно попробовать возложить парсер на плечи браузера, как пример
https://codepen.io/anon/pen/XBjbYE?editors=0011

Comments

[saalaus]

спасибо, теперь появилась проблема с тем, что на текст типа <b>привет, <i>сосед</i></b> создается один объект, у которого текст привет, сосед и bold: true (((

[ⓒⓢⓢ]

да, вполне логично.

Любую удобную структуру для хранения вложенных строк, подобие что-то такое:

[
  {
    text: "привет, "
    bold: true,
    inner: {
      text: "сосед",
      italic: true
    }
  }
]

и так же аналогично парсите

[saalaus]

что-то я вас не понимаю.....