JS: Получить HTML между комментариями в строке

Question

Итак, у меня есть этот HTML

<div contenteditable="true">
  <div class="parent-wrap">
    <!-- RAW start -->
    <p>Lorem</p>
    <p>Ipsum</p>
    <div>Dolor sit amet</div>
    <!-- RAW end -->
  </div>
  <a href="#">Read more</a>
</div>

Мне нужно получить html между двумя html-комментариями (без самих комментариев), поэтому просто 2 <p> и <div>Dolor sit amet</div>.Я получаю HTML прямо со страницы с innerHTML.

Вот мой JS:

getValue () {
  let html = editor.innerHTML
  let rawStart = '<!-- RAW start -->'
  let rawEnd = '<!-- RAW end -->'
  if (html.search(rawStart) && html.search(rawEnd)) {
    html = html.split(rawStart).pop().split(rawEnd)[0]
  }
  return html
}

Это работает, но мне было интересно, есть ли лучшие способы?И будет ли это работать везде?Или есть браузеры, которые изменяют комментарии html (например, удаляют пробелы)?

Answer 1

Вместо использования .innerHTML вы можете использовать editor.children внутри цикла for, который объединяет все свойства externalHTML на дочерних узлах, например, так:

<div contenteditable="true">
  <div class="parent-wrap">
    <!-- RAW start -->
    <p>Lorem</p>
    <p>Ipsum</p>
    <div>Dolor sit amet</div>
    <!-- RAW end -->
  </div>
  <a href="#">Read more</a>
</div>

function getValue() {
  let div = document.querySelector('.parent-wrap');
  let html = '';
  for(let i=0; i < div.children.length; i++) {
    html += div.children[i].outerHTML
  }
  return html;
}