如何从div获取格式正确的文本值

Question

我试图从contenteditable ='true'div获取格式化文本发送到我的服务器.

我曾经使用textarea,当你得到textarea的值时,它会保留空格和换行符,但是当使用contenteditable div时,即使使用以下样式我也无法获得格式正确的文本:

white-space: pre-wrap;
word-wrap: break-word;

例如,如果我在我的div中输入:

"a
 aa

asdf"

我会用textContent来解决这个问题:

"a aaasdf"

有没有办法让格式化文本从像textarea这样的可信任的div中获取？

Answer 1

使用.innerHTML得到的换行符了.

读取:.innerHTML| MDN

工作代码片段:

document.getElementById('copy').addEventListener('click', function(){
  var text = document.getElementById('input').innerHTML;
  document.getElementById('output').innerHTML = text;
});

div{
  width: 200px;
  height: 200px;
  border: 1px solid black;
  display: inline-block;
  vertical-align: top;
}

<div contenteditable='true' id="input">Enter something funny<br>;)</div>

<button id="copy">Copy Text</button>

<div id="output">Text will be copied here.</div>