wangEditor源码部分解读

最近在做富文本相关的探索，看了下wangEditor和draft.js，draft.js相对复杂一些吧，wangEditor的代码就比较直白，注释比较多，比较适合阅读，大体讨论一下wangEditor的结构。版本是v3.1.1，讲下大概原理，不会每个功能都讲。

先看使用方式，

var E = require('wangeditor');

var editor = new E('#editor');
editor.create()

// 自己定义分开的工具栏和编辑区
var editor1 = new E('#div1', '#div2')

代码大体目录结构如下：

1. /src/js/editor中是编辑器的构造函数和一些初始化

2. /src/js/util中是各种辅助功能，其中有一个dom-core.js文件，封装了一些dom方法并导出为$，可以稍微看一下，避免后面看其他代码被原生方法和封装的方法弄混

3. /src/js/command中封装了document的execCommand、queryCommandValue、queryCommandState、queryCommandSupported等方法，是改变编辑区内文本样式的核心方法

4. /src/js/menus中是支持的功能的实现，比如加粗、斜体、字体颜色等

5. /src/js/selection中封装了和选区有关的方法，也属于核心方法

6. /src/js/text中是编辑区的事件绑定，及文本内容相关的代码

原理

主要原