javascript - 保存本地文本文件，检测 contenteditable div 的新行和空格

Question

假设我有一个 contenteditable div 并以此文本作为输入

<div id="board" contenteditable="true">
   <div>ab</div>
   <div>   cd</div>
   <div></div>
   <div>e   f</div>
</div>

JS

var text = "";

if (typeof window.getSelection != "undefined") {
    var sel = window.getSelection();
    sel.selectAllChildren(el);
    text = sel.toString();
    sel.removeAllRanges();
} 

else if (document.body.createTextRange) {
    var textRange = document.body.createTextRange();
    textRange.moveToElementText(el);
    text = textRange.text;
}

警告text将为我提供所需的格式(带有换行符和空格)。但是当我使用 filesaver.js 保存它时，新行会在文本文件中丢失。在保存文本之前如何操作文本？

Answer 1

text = sel.toString(); 返回什么？如果您希望文本“可排列”，则必须在某个时刻包含 \r\n。

如果sel.selectAllChildren(el);返回一个集合，则必须对其进行迭代。 text = sel.toString() 可以使用空分隔符连接所有值，例如“”。您的分隔符必须是 \r\n。

配方如下:

• 选择所有#board 的 div 子级
• 然后获取您放入数组中的每个元素的文本值
• 使用 yourArray.join('\r\n') 连接值