测试版本：4.7.1

0、构建textarea文本框、引入核心文件
<textarea id="editor1"></textarea>
<script src="https://cdn.bootcss.com/ckeditor/4.7.2/ckeditor.js"></script>  

1、CKEDITOR.config.filebrowserImageUploadUrl = url;       //图片上传地址
2、CKEDITOR.config.enterMode = CKEDITOR.ENTER_BR;        //去掉默认的<p>标签
3、CKEDITOR.config.allowedContent = true;            //允许使用所有标签


4、常规工具栏
var toolbars = [
    [ 'PasteText', 'Undo', 'Redo'],
    [ 'Link', 'Unlink'],
    [ 'Image', 'HorizontalRule'],
    [ 'Bold', 'Italic', 'RemoveFormat'],
    [ 'Styles', 'Format','Source']
];


5、初始化id为editor1的编辑器
CKEDITOR.replace('editor1', {      
    width:778,                 //编辑器宽度
    toolbar :toolbars,
    disallowedContent:'img{width,height};img[width,height]',   //禁用自动给图片加width，height属性
});


6、为editor1编辑器设置内容
CKEDITOR.instances.editor1.setData('<span>内容</span>');

7、获取editor1编辑器的内容
CKEDITOR.instances.editor1.getData();

8、更新editor1编辑器内容，方便form表单提交数据
CKEDITOR.instances.editor1.updateElement();

9、批量更新技巧
for (var i in CKEDITOR.instances) {
    CKEDITOR.instances[i].updateElement();
}

10、封装api对象

var ck = {
    updateAll: function () {
        for (instance in CKEDITOR.instances) {
            CKEDITOR.instances[instance].updateElement();
        }
    },
    resetAll: function () {
        for (instance in CKEDITOR.instances) {
            CKEDITOR.instances[instance].setData("");
        }
    },
    update: function (id) {
        CKEDITOR.instances[id].updateElement();
    },
    reset: function (id) {
        CKEDITOR.instances[id].setData("");
    },
    set: function (id, content) {
        CKEDITOR.instances[id].setData(content);
    },
    get: function(id) {
        return CKEDITOR.instances[id].getData();
    },
    insert: function (id, content) {
        CKEDITOR.instances[id].insertHtml(content);
    }
};

11、disallowedContent:'img{width,height};img[width,height];img{border*,margin*}; table[border]{*}',   //去除自动给图片加width，height等属性

可以去掉这些自定义样式

2017年11月7日更新：

当

CKEDITOR.config.allowedContent = true;

跟

disallowedContent:'img{width,height};img[width,height];img{border*,margin*};

一起使用的时候，图片设置会失效。

暂时性方案:

去掉

CKEDITOR.config.allowedContent = true;

参考：https://docs.ckeditor.com/#!/guide/dev_disallowed_content

转自：http://blog.sina.com.cn/s/blog_56f273130102wc7w.html

来自ansion博客 

http://www.tp0.top

2017-09-01 21:35:26