第一种:wangEditor(地址:https://www.kancloud.cn/wangfupeng/wangeditor3/332599

首先需要引入js

<script type="text/javascript" src="https://unpkg.com/wangeditor@3.1.1/release/wangEditor.min.js"></script>

其次在页面中定义

<div id="editor"> </div>

然后在js中

<script type="text/javascript">
    var E = window.wangEditor
    var editor = new E('#editor')
    // 或者 var editor = new E( document.getElementById('editor') )
    editor.create()
 
    console.log(editor.txt.text())//获取富文本编辑器的值
</script>

第二种:ueditor (最新版地址:http://ueditor.baidu.com/website/download.html#ueditor)

第一步:引入文件

<script type="text/javascript" charset="gbk" src="ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="gbk" src="ueditor/ueditor.all.min.js"></script>

第二步:html文件

<script id="editor" type="text/plain" style="width:400px;height:300px;"></script>

第三步:js

<script type="text/javascript">
        //实例化编辑器
        var ue = UE.getEditor('editor', {
            initialFrameWidth: 800,
            initialFrameHeight: 400,
            autoFloatEnabled: false,
            autoHeightEnabled: false,
            elementPathEnabled: false,
            enableAutoSave: false
        });
</script>