js富文本编辑器原理
一般的,符文u本编辑器都不是用<textarea />标签做的,而是使用<div />标签做的;
<div />标签有一个叫做“contenteditable”的属性,加上这个属性之后,这个<div />里面就可以进行编辑操作。
<div contenteditable style="border: 1px solid #F00; width: 100%; min-height: 300px" > <span>这里是富文本编辑器</span> </div>
加了这个属性之后,这个<div />里面的所有节点都能进入可编辑状态,
编辑好之后,再获取所有dom内容,一起转为JSON字符串发送给后端 保存。
用到的属性:
document.execCommand(aCommandName, aShowDefaultUI, aValueArgument)