В общем, делаю свой текстовый редактор на contenteditable, естественно там есть функции жирный, курсивный и подчеркнутый текст по выделению, мне нужно сделать, чтобы каждый элемент заносился в отдельный объект, допустим что я ввожу в textarea, и какой объект должен получится:
<b>привет, <i>сосед</i></b>, как дела?
{
"text1":{
"text": "привет, ",
"bold": true
},
"text2":{
"text": "сосед",
"bold": true.
"italic": true
},
"text3":{
"text":", как дела?"
}
}
есть такая функция, она берет все дочерние ноды у родителя, берет у них текст, затем проверяет на наличие тегов, и записывает теги, если они есть
function parseNode(node) {
let result = [];
if (node.hasChildNodes()) {
let children = node.childNodes;
for (var i = 0; i < children.length; ++i) {
let obj = { 'text': children[i].textContent };
if (children[i].nodeName === "B") obj.bold = true;
if (children[i].nodeName === "I") obj.italic = true;
if (children[i].hasChildNodes() && children[i].childNodes[0].nodeName === "B") { obj.bold = true; }
if (children[i].hasChildNodes() && children[i].childNodes[0].nodeName === "I") { obj.italic = true; }
if (children[i].hasChildNodes() && children[i].childNodes[0].nodeName === "U") { obj.undeline = true; }
result.push(obj);
}
}
return result;
}
код работает правильно, но у меня возникла проблема, а именно, с тем, что если у одного текста есть 1 общий тег, и 1 раздельный, то есть допустим так:
<b>Привет, <i>сосед</i></b>
то получается такой объект:
[Object
{
bold:true,
text:"Привет, сосед"
}
]
В общем, помогите это исправить, я хочу чтобы у меня получился такой объект:
[Object{
text:"Привет,",
bold: true
}, Object{
text:"сосед",
bold: true,
italic: true
Песочница(объект в консоли)