ueditor源码分析--程序结构

ueditor源码分析--程序结构

写在前面：

因为项目需要一个富文本编辑器，可供选择的有很多，最后之所以选择baidu的Ueditor,一个是免费，再一个是中国写的，有注释，有文档，方便入手。因为根据自己的项目需求，自己需要的功能很简单，需要对一些个的功能进行删减或者修改，而Ueditor又是基于插件来完成的各种的功能，定制化上方便很多，虽然其可以在配置文件中选择使用哪些功能，但是对于有些代码洁癖的我来说，我用不到的东西却要存在我的项目中，会让我很不爽，所以加加剪剪在所难免。比如表格的一些功能，完全用不上的东西，必须删掉。尝试过使用Umeditor,就是Ueditor的精简版。但是测试的时候有点问题，，，。

本人不是做前端的，平时涉及到的前端就是写个函数，操作下dom 元素很简单。New用到的机会都很少。更没有写过js程序。所以刚开始接触Uedtor时，心中是一万个曹尼玛，但是秉着Reading the fuck source code的态度，了解下Ueditor的结构，这样做増减的时候心中有数，不至于糊里糊涂的，当然其中很多的实现细节，没有去关注。最好是学过一些原型与闭包的知识。

Js前端的大牛就直接略过吧，写这个文章的目的一个是方便自己以后的查阅，忘的很快，再一个给像有我这种需求的人一个参考。

以下代码是从github上下载的1.5.0的开发版本。

正文

       最开始觉得Ueditor的代码晦涩难懂，是因为没有看明白其中的结构，据说是标准的web开发的结构，所以先从对象结构开始：

UEDITOR_CONFIG = window.UEDITOR_CONFIG || {};

var baidu = window.baidu

window.baidu = baidu;

window.UE = baidu.editor =  window.UE

UE.plugins = {};

UE.commands = {};

UE.instants = {};

UE.I18N = {};

UE._customizeUI = {};

var dom = UE.dom = {};

先看明白这个大写的UE是window的全局变量。window.UE = baidu.e