javascript - 替换选定 - 由 contenteditable div 中的所需 html

Question

请全选并单击按钮，
这是我替换选中的方式 - 使用所需的 html，在 Chrome
中它基本上可以工作，但是 - 两个问题：

• 有没有更本土的方法来做同样的事情？特别是关于execCommand我想避免的
• 有时行尾不是\n\nbut \n。将来它可能是一些新的。有没有办法检测到它并通过检测到拆分？

$('button').on('click', function(){
  let a = window.getSelection().toString();
  let arr = a.split("\n\n");
  var count = arr.length;
  var final = '';
  $(arr).each(function(key, val){
    if(key == 0){val = "<p class='dg'>" + val + "<br>" + "\n"}
    else if(key == count-1){val = val + "</p>" + "\n";}
    else{val = val + "<br>" + "\n";}
    final += val;
  });
  document.execCommand('insertHtml', false, final);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id='cedit' contenteditable>
<p>lorem</p>
<p>ipsum</p>
<p>dolor</p>
<p>sit</p>
</div>

<button>CLICK</button>

标签： javascriptjquery