Hi

CKEditor系列教程（一）

CKEditor 前端应用

CkEditor有4版本以及最新5系列版本，看了内容，感觉4就够了，有兴趣的人可以下载5。

下载地址

https://ckeditor.com/ckeditor-4/download/

CkEditor4有4个版本下载：base（基础版）、standard（标准版）、full（完整版）、custome（定制版）。

说白了就是插件多少的问题，建议选择full版本，反正项目部署到服务器，CkEditor插件每次也不会更新，不会影响任何问题。

其他方式安装：https://ckeditor.com/docs/ckeditor4/latest/guide/dev_installation.html

Demo

HTML

<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title>ditor demo</title>
    <script type="text/javascript" src="ckeditor_4.15.1_full_easyimage/ckeditor.js"></script>
</head>
<body>
    <button onclick="show()">展示</button>
    <br>
    <br>
    <form>
        <textarea name="articleArea" id="articleArea" rows="10" cols="80">
        </textarea>
    </form>

</body>
<script>
    // with a CKEditor 4, instance, using default configuration.
    CKEDITOR.replace( 'articleArea' );

    function show() {
         var editor_data = CKEDITOR.instances.articleArea.getData();
        console.log(editor_data)
    }

</script>
</html>

show方法是打印内容。

学习参考

官网：https://ckeditor.com/
CKEditor系列教程（一）：CkEditor的安装与基础使用
CKEditor系列教程（二）：CkEditor的配置说明
CKEditor系列教程（三）：CkEditor图片上传到服务端