ckeditor5的配置以及使⽤⽅法⼀.⾃定义并构建CKEditor 5⼆.CKEditor 5⽂件详解1. translations:打包后的语⾔包2. ckeditor.js、ckeditor.js.map:js配置,⾥⾯包含css样式,⽆论是编辑器页⾯还是显⽰内容页⾯都需要引⼊(之前显⽰内容时图⽚不⾃适应就是没有引⼊该⽂件)3. editor.js:进⾏功能配置的js⽂件,在编辑器页⾯引⼊4. index.html:富⽂本编辑器测试页⾯最外⾯div必须加上id名(可⾃定义)5. ceshi.html:显⽰内容页⾯最外⾯的div样式名必须为ck-content三.editor.js配置说明1. 调⽤⽅法toolbar:配置在导航栏显⽰的功能按钮以及位置2.图⽚上传3.⾃定义providers,给上传的视频链接设置相应的html,让其可以正常在富⽂本编辑器中显⽰4.⾃定义字体,字体中⽂名在前,英⽂编码在后,⽤逗号隔开5.将编辑器输出给到全局变量6.获取内容数据以及将html转换为编辑器内容的API,⽆论是获取编辑器内容还是将html⽚段插⼊到编辑器中都需要对某些字段进⾏转换(获取编辑器内容后将oembed标签转换为video标签;给编辑器插⼊内容之前将video标签转换为oembed标签,同时还要清理上次插⼊的数据)7.获取的内容数据中视频由浏览器⽆法识别的标签包裹,所以需要对其进⾏替换,使其在⽹页中正常显⽰。
8.初始化编辑器实例必须通过id获取标签,但是可以单独将配置对象赋值给config变量,初始化多个编辑器时将config传进去就可以实现修改⼀个配置影响多个编辑器实例。
9.字号⽀持数字⼤⼩10.设置编辑器的宽和最⼩⾼度、最⼤⾼度、固定⾼度11.配置字体颜⾊和字体背景颜⾊12.设置图⽚放置的位置以及百分⽐配置代码//配置选项const config = {//功能模块toolbar: {items: ['heading','|','bold','italic','underline','fontColor','fontBackgroundColor','fontSize','fontFamily','highlight','bulletedList','numberedList','|','indent','outdent','|','link','imageUpload','imageInsert','mediaEmbed','|','blockQuote','strikethrough','specialCharacters','superscript','subscript','insertTable','undo','redo','alignment'],shouldNotGroupWhenFull:true},//设置字体⼤⼩fontSize: {options: [12,14,16,18,20,22,24,36]},//设置字体颜⾊fontColor: {colors: [{color: 'hsl(0, 0%, 0%)',label: 'hsl(0, 0%, 0%)'},{color: 'hsl(0, 0%, 12.5%)', label: 'hsl(0, 0%, 12.5%)' },{color: 'hsl(0, 0%, 25%)', label: 'hsl(0, 0%, 25%)'},{color: 'hsl(0, 0%, 37.5%)', label: 'hsl(0, 0%, 37.5%)' },{color: 'hsl(0, 0%, 50%)', label: 'hsl(0, 0%, 50%)'},{color: 'hsl(0, 0%, 62.5%)', label: 'hsl(0, 0%, 62.5%)' },{color: 'hsl(0, 0%, 75%)', label: 'hsl(0, 0%, 75%)'},{color: 'hsl(0, 0%, 87.5%)', label: 'hsl(0, 0%, 87.5%)' },{color: 'hsl(0, 0%, 100%)', label: 'hsl(0, 0%, 100%)' },{color: 'hsl(0, 100%, 10%)', label: 'hsl(0, 100%, 10%)' },{color: 'hsl(0, 100%, 20%)', label: 'hsl(0, 100%, 20%)' },{color: 'hsl(0, 100%, 30%)', label: 'hsl(0, 100%, 30%)' },{color: 'hsl(0, 100%, 40%)', label: 'hsl(0, 100%, 40%)' },{color: 'hsl(0, 100%, 50%)', label: 'hsl(0, 100%, 50%)' },{color: 'hsl(0, 100%, 60%)', label: 'hsl(0, 100%, 60%)' },{color: 'hsl(0, 100%, 70%)', label: 'hsl(0, 100%, 70%)' },{color: 'hsl(0, 100%, 80%)', label: 'hsl(0, 100%, 80%)' },{color: 'hsl(0, 100%, 90%)', label: 'hsl(0, 100%, 90%)' },{color: 'hsl(30, 100%, 30%)', label: 'hsl(30, 100%, 30%)' },{color: 'hsl(30, 100%, 40%)', label: 'hsl(30, 100%, 40%)' },{color: 'hsl(30, 100%, 50%)', label: 'hsl(30, 100%, 50%)' },{color: 'hsl(30, 100%, 60%)', label: 'hsl(30, 100%, 60%)' },{color: 'hsl(30, 100%, 70%)', label: 'hsl(30, 100%, 70%)' },{color: 'hsl(30, 100%, 80%)', label: 'hsl(30, 100%, 80%)' },{color: 'hsl(30, 100%, 90%)', label: 'hsl(30, 100%, 90%)' },{color: 'hsl(60, 100%, 10%)', label: 'hsl(60, 100%, 10%)' },{color: 'hsl(60, 100%, 20%)', label: 'hsl(60, 100%, 20%)' },{color: 'hsl(60, 100%, 30%)', label: 'hsl(60, 100%, 30%)' },{color: 'hsl(60, 100%, 40%)', label: 'hsl(60, 100%, 40%)' },{color: 'hsl(60, 100%, 50%)', label: 'hsl(60, 100%, 50%)' },{color: 'hsl(60, 100%, 60%)', label: 'hsl(60, 100%, 60%)' },{color: 'hsl(60, 100%, 70%)', label: 'hsl(60, 100%, 70%)' },{color: 'hsl(60, 100%, 80%)', label: 'hsl(60, 100%, 80%)' },{color: 'hsl(60, 100%, 90%)', label: 'hsl(60, 100%, 90%)' },{color: 'hsl(90, 100%, 10%)', label: 'hsl(90, 100%, 10%)' },{color: 'hsl(90, 100%, 20%)', label: 'hsl(90, 100%, 20%)' },{color: 'hsl(90, 100%, 30%)', label: 'hsl(90, 100%, 30%)' },{color: 'hsl(90, 100%, 60%)', label: 'hsl(90, 100%, 60%)' },{color: 'hsl(90, 100%, 70%)', label: 'hsl(90, 100%, 70%)' },{color: 'hsl(90, 100%, 80%)', label: 'hsl(90, 100%, 80%)' },{color: 'hsl(90, 100%, 90%)', label: 'hsl(90, 100%, 90%)' },{color: 'hsl(120, 100%, 10%)', label: 'hsl(120, 100%, 10%)' },{color: 'hsl(120, 100%, 20%)', label: 'hsl(120, 100%, 20%)' },{color: 'hsl(120, 100%, 30%)', label: 'hsl(120, 100%, 30%)' },{color: 'hsl(120, 100%, 40%)', label: 'hsl(120, 100%, 40%)' },{color: 'hsl(120, 100%, 50%)', label: 'hsl(120, 100%, 50%)' },{color: 'hsl(120, 100%, 60%)', label: 'hsl(120, 100%, 60%)' },{color: 'hsl(120, 100%, 70%)', label: 'hsl(120, 100%, 70%)' },{color: 'hsl(120, 100%, 80%)', label: 'hsl(120, 100%, 80%)' },{color: 'hsl(120, 100%, 90%)', label: 'hsl(120, 100%, 90%)' },{color: 'hsl(150, 100%, 10%)', label: 'hsl(150, 100%, 10%)' },{color: 'hsl(150, 100%, 20%)', label: 'hsl(150, 100%, 20%)' },{color: 'hsl(150, 100%, 30%)', label: 'hsl(150, 100%, 30%)' },{color: 'hsl(150, 100%, 40%)', label: 'hsl(150, 100%, 40%)' },{color: 'hsl(150, 100%, 50%)', label: 'hsl(150, 100%, 50%)' },{color: 'hsl(150, 100%, 60%)', label: 'hsl(150, 100%, 60%)' },{color: 'hsl(150, 100%, 90%)', label: 'hsl(150, 100%, 90%)' },{color: 'hsl(180, 100%, 10%)', label: 'hsl(180, 100%, 10%)' },{color: 'hsl(180, 100%, 20%)', label: 'hsl(180, 100%, 20%)' },{color: 'hsl(180, 100%, 30%)', label: 'hsl(180, 100%, 30%)' },{color: 'hsl(180, 100%, 40%)', label: 'hsl(180, 100%, 40%)' },{color: 'hsl(180, 100%, 50%)', label: 'hsl(180, 100%, 50%)' },{color: 'hsl(180, 100%, 60%)', label: 'hsl(180, 100%, 60%)' },{color: 'hsl(180, 100%, 70%)', label: 'hsl(180, 100%, 70%)' },{color: 'hsl(180, 100%, 80%)', label: 'hsl(180, 100%, 80%)' },{color: 'hsl(180, 100%, 90%)', label: 'hsl(180, 100%, 90%)' },{color: 'hsl(210, 100%, 10%)', label: 'hsl(210, 100%, 10%)' },{color: 'hsl(210, 100%, 20%)', label: 'hsl(210, 100%, 20%)' },{color: 'hsl(210, 100%, 30%)', label: 'hsl(210, 100%, 30%)' },{color: 'hsl(210, 100%, 40%)', label: 'hsl(210, 100%, 40%)' },{color: 'hsl(210, 100%, 50%)', label: 'hsl(210, 100%, 50%)' },{color: 'hsl(210, 100%, 60%)', label: 'hsl(210, 100%, 60%)' },{color: 'hsl(210, 100%, 70%)', label: 'hsl(210, 100%, 70%)' },{color: 'hsl(210, 100%, 80%)', label: 'hsl(210, 100%, 80%)' },{color: 'hsl(210, 100%, 90%)', label: 'hsl(210, 100%, 90%)' },{color: 'hsl(240, 100%, 30%)', label: 'hsl(240, 100%, 30%)' },{color: 'hsl(240, 100%, 40%)', label: 'hsl(240, 100%, 40%)' },{color: 'hsl(240, 100%, 50%)', label: 'hsl(240, 100%, 50%)' },{color: 'hsl(240, 100%, 60%)', label: 'hsl(240, 100%, 60%)' },{color: 'hsl(240, 100%, 70%)', label: 'hsl(240, 100%, 70%)' },{color: 'hsl(240, 100%, 80%)', label: 'hsl(240, 100%, 80%)' },{color: 'hsl(240, 100%, 90%)', label: 'hsl(240, 100%, 90%)' },{color: 'hsl(270, 100%, 10%)', label: 'hsl(270, 100%, 10%)' },{color: 'hsl(270, 100%, 20%)', label: 'hsl(270, 100%, 20%)' },{color: 'hsl(270, 100%, 30%)', label: 'hsl(270, 100%, 30%)' },{color: 'hsl(270, 100%, 40%)', label: 'hsl(270, 100%, 40%)' },{color: 'hsl(270, 100%, 50%)', label: 'hsl(270, 100%, 50%)' },{color: 'hsl(270, 100%, 60%)', label: 'hsl(270, 100%, 60%)' },{color: 'hsl(270, 100%, 70%)', label: 'hsl(270, 100%, 70%)' },{color: 'hsl(270, 100%, 80%)', label: 'hsl(270, 100%, 80%)' },{color: 'hsl(270, 100%, 90%)', label: 'hsl(270, 100%, 90%)' },{color: 'hsl(300, 100%, 10%)', label: 'hsl(300, 100%, 10%)' },{color: 'hsl(300, 100%, 20%)', label: 'hsl(300, 100%, 20%)' },{color: 'hsl(300, 100%, 30%)', label: 'hsl(300, 100%, 30%)' },{color: 'hsl(300, 100%, 60%)', label: 'hsl(300, 100%, 60%)' },{color: 'hsl(300, 100%, 70%)', label: 'hsl(300, 100%, 70%)' },{color: 'hsl(300, 100%, 80%)', label: 'hsl(300, 100%, 80%)' },{color: 'hsl(300, 100%, 90%)', label: 'hsl(300, 100%, 90%)' },{color: 'hsl(330, 100%, 10%)', label: 'hsl(330, 100%, 10%)' },{color: 'hsl(330, 100%, 20%)', label: 'hsl(330, 100%, 20%)' },{color: 'hsl(330, 100%, 30%)', label: 'hsl(330, 100%, 30%)' },{color: 'hsl(330, 100%, 40%)', label: 'hsl(330, 100%, 40%)' },{color: 'hsl(330, 100%, 50%)', label: 'hsl(330, 100%, 50%)' },{color: 'hsl(330, 100%, 60%)', label: 'hsl(330, 100%, 60%)' },{color: 'hsl(330, 100%, 70%)', label: 'hsl(330, 100%, 70%)' },{color: 'hsl(330, 100%, 80%)', label: 'hsl(330, 100%, 80%)' },{color: 'hsl(330, 100%, 90%)', label: 'hsl(330, 100%, 90%)' },],//列columns: 9,},//设置字体背景颜⾊fontBackgroundColor: {colors: [{color: 'hsl(0, 0%, 0%)',label: 'hsl(0, 0%, 0%)'},{color: 'hsl(0, 0%, 12.5%)', label: 'hsl(0, 0%, 12.5%)'},{color: 'hsl(0, 0%, 25%)',label: 'hsl(0, 0%, 25%)'},{color: 'hsl(0, 0%, 37.5%)', label: 'hsl(0, 0%, 37.5%)'},{color: 'hsl(0, 0%, 75%)',label: 'hsl(0, 0%, 75%)'},{color: 'hsl(0, 0%, 87.5%)', label: 'hsl(0, 0%, 87.5%)' },{color: 'hsl(0, 0%, 100%)', label: 'hsl(0, 0%, 100%)'},{color: 'hsl(0, 100%, 10%)', label: 'hsl(0, 100%, 10%)' },{color: 'hsl(0, 100%, 20%)', label: 'hsl(0, 100%, 20%)' },{color: 'hsl(0, 100%, 30%)', label: 'hsl(0, 100%, 30%)' },{color: 'hsl(0, 100%, 40%)', label: 'hsl(0, 100%, 40%)' },{color: 'hsl(0, 100%, 50%)', label: 'hsl(0, 100%, 50%)' },{color: 'hsl(0, 100%, 60%)', label: 'hsl(0, 100%, 60%)' },{color: 'hsl(0, 100%, 70%)', label: 'hsl(0, 100%, 70%)' },{color: 'hsl(0, 100%, 80%)', label: 'hsl(0, 100%, 80%)' },{color: 'hsl(0, 100%, 90%)', label: 'hsl(0, 100%, 90%)' },{color: 'hsl(30, 100%, 10%)', label: 'hsl(30, 100%, 10%)' },{color: 'hsl(30, 100%, 20%)', label: 'hsl(30, 100%, 20%)' },{color: 'hsl(30, 100%, 30%)', label: 'hsl(30, 100%, 30%)' },{color: 'hsl(30, 100%, 40%)', label: 'hsl(30, 100%, 40%)' },{color: 'hsl(30, 100%, 50%)', label: 'hsl(30, 100%, 50%)' },{color: 'hsl(30, 100%, 60%)', label: 'hsl(30, 100%, 60%)' },{color: 'hsl(30, 100%, 70%)', label: 'hsl(30, 100%, 70%)' },{color: 'hsl(60, 100%, 10%)', label: 'hsl(60, 100%, 10%)' },{color: 'hsl(60, 100%, 20%)', label: 'hsl(60, 100%, 20%)' },{color: 'hsl(60, 100%, 30%)', label: 'hsl(60, 100%, 30%)' },{color: 'hsl(60, 100%, 40%)', label: 'hsl(60, 100%, 40%)' },{color: 'hsl(60, 100%, 50%)', label: 'hsl(60, 100%, 50%)' },{color: 'hsl(60, 100%, 60%)', label: 'hsl(60, 100%, 60%)' },{color: 'hsl(60, 100%, 70%)', label: 'hsl(60, 100%, 70%)' },{color: 'hsl(60, 100%, 80%)', label: 'hsl(60, 100%, 80%)' },{color: 'hsl(60, 100%, 90%)', label: 'hsl(60, 100%, 90%)' },{color: 'hsl(90, 100%, 10%)', label: 'hsl(90, 100%, 10%)' },{color: 'hsl(90, 100%, 20%)', label: 'hsl(90, 100%, 20%)' },{color: 'hsl(90, 100%, 30%)', label: 'hsl(90, 100%, 30%)' },{color: 'hsl(90, 100%, 40%)', label: 'hsl(90, 100%, 40%)' },{color: 'hsl(90, 100%, 50%)', label: 'hsl(90, 100%, 50%)' },{color: 'hsl(90, 100%, 60%)', label: 'hsl(90, 100%, 60%)' },{color: 'hsl(90, 100%, 70%)', label: 'hsl(90, 100%, 70%)' },{color: 'hsl(90, 100%, 80%)', label: 'hsl(90, 100%, 80%)' },{color: 'hsl(90, 100%, 90%)', label: 'hsl(90, 100%, 90%)' },{color: 'hsl(120, 100%, 10%)', label: 'hsl(120, 100%, 10%)' },{color: 'hsl(120, 100%, 40%)', label: 'hsl(120, 100%, 40%)' },{color: 'hsl(120, 100%, 50%)', label: 'hsl(120, 100%, 50%)' },{color: 'hsl(120, 100%, 60%)', label: 'hsl(120, 100%, 60%)' },{color: 'hsl(120, 100%, 70%)', label: 'hsl(120, 100%, 70%)' },{color: 'hsl(120, 100%, 80%)', label: 'hsl(120, 100%, 80%)' },{color: 'hsl(120, 100%, 90%)', label: 'hsl(120, 100%, 90%)' },{color: 'hsl(150, 100%, 10%)', label: 'hsl(150, 100%, 10%)' },{color: 'hsl(150, 100%, 20%)', label: 'hsl(150, 100%, 20%)' },{color: 'hsl(150, 100%, 30%)', label: 'hsl(150, 100%, 30%)' },{color: 'hsl(150, 100%, 40%)', label: 'hsl(150, 100%, 40%)' },{color: 'hsl(150, 100%, 50%)', label: 'hsl(150, 100%, 50%)' },{color: 'hsl(150, 100%, 60%)', label: 'hsl(150, 100%, 60%)' },{color: 'hsl(150, 100%, 70%)', label: 'hsl(150, 100%, 70%)' },{color: 'hsl(150, 100%, 80%)', label: 'hsl(150, 100%, 80%)' },{color: 'hsl(150, 100%, 90%)', label: 'hsl(150, 100%, 90%)' },{color: 'hsl(180, 100%, 10%)', label: 'hsl(180, 100%, 10%)' },{color: 'hsl(180, 100%, 20%)', label: 'hsl(180, 100%, 20%)' },{color: 'hsl(180, 100%, 30%)', label: 'hsl(180, 100%, 30%)' },{color: 'hsl(180, 100%, 40%)', label: 'hsl(180, 100%, 40%)' },{color: 'hsl(180, 100%, 70%)', label: 'hsl(180, 100%, 70%)' },{color: 'hsl(180, 100%, 80%)', label: 'hsl(180, 100%, 80%)' },{color: 'hsl(180, 100%, 90%)', label: 'hsl(180, 100%, 90%)' },{color: 'hsl(210, 100%, 10%)', label: 'hsl(210, 100%, 10%)' },{color: 'hsl(210, 100%, 20%)', label: 'hsl(210, 100%, 20%)' },{color: 'hsl(210, 100%, 30%)', label: 'hsl(210, 100%, 30%)' },{color: 'hsl(210, 100%, 40%)', label: 'hsl(210, 100%, 40%)' },{color: 'hsl(210, 100%, 50%)', label: 'hsl(210, 100%, 50%)' },{color: 'hsl(210, 100%, 60%)', label: 'hsl(210, 100%, 60%)' },{color: 'hsl(210, 100%, 70%)', label: 'hsl(210, 100%, 70%)' },{color: 'hsl(210, 100%, 80%)', label: 'hsl(210, 100%, 80%)' },{color: 'hsl(210, 100%, 90%)', label: 'hsl(210, 100%, 90%)' },{color: 'hsl(240, 100%, 10%)', label: 'hsl(240, 100%, 10%)' },{color: 'hsl(240, 100%, 20%)', label: 'hsl(240, 100%, 20%)' },{color: 'hsl(240, 100%, 30%)', label: 'hsl(240, 100%, 30%)' },{color: 'hsl(240, 100%, 40%)', label: 'hsl(240, 100%, 40%)' },{color: 'hsl(240, 100%, 50%)', label: 'hsl(240, 100%, 50%)' },{color: 'hsl(240, 100%, 60%)', label: 'hsl(240, 100%, 60%)' },{color: 'hsl(240, 100%, 70%)', label: 'hsl(240, 100%, 70%)' },{color: 'hsl(270, 100%, 10%)', label: 'hsl(270, 100%, 10%)' },{color: 'hsl(270, 100%, 20%)', label: 'hsl(270, 100%, 20%)' },{color: 'hsl(270, 100%, 30%)', label: 'hsl(270, 100%, 30%)' },{color: 'hsl(270, 100%, 40%)', label: 'hsl(270, 100%, 40%)' },{color: 'hsl(270, 100%, 50%)', label: 'hsl(270, 100%, 50%)' },{color: 'hsl(270, 100%, 60%)', label: 'hsl(270, 100%, 60%)' },{color: 'hsl(270, 100%, 70%)', label: 'hsl(270, 100%, 70%)' },{color: 'hsl(270, 100%, 80%)', label: 'hsl(270, 100%, 80%)' },{color: 'hsl(270, 100%, 90%)', label: 'hsl(270, 100%, 90%)' },{color: 'hsl(300, 100%, 10%)', label: 'hsl(300, 100%, 10%)' },{color: 'hsl(300, 100%, 20%)', label: 'hsl(300, 100%, 20%)' },{color: 'hsl(300, 100%, 30%)', label: 'hsl(300, 100%, 30%)' },{color: 'hsl(300, 100%, 40%)', label: 'hsl(300, 100%, 40%)' },{color: 'hsl(300, 100%, 50%)', label: 'hsl(300, 100%, 50%)' },{color: 'hsl(300, 100%, 60%)', label: 'hsl(300, 100%, 60%)' },{color: 'hsl(300, 100%, 70%)', label: 'hsl(300, 100%, 70%)' },{color: 'hsl(300, 100%, 80%)', label: 'hsl(300, 100%, 80%)' },{color: 'hsl(300, 100%, 90%)', label: 'hsl(300, 100%, 90%)' },{color: 'hsl(330, 100%, 10%)', label: 'hsl(330, 100%, 10%)' },{color: 'hsl(330, 100%, 40%)',label: 'hsl(330, 100%, 40%)'},{color: 'hsl(330, 100%, 50%)',label: 'hsl(330, 100%, 50%)'},{color: 'hsl(330, 100%, 60%)',label: 'hsl(330, 100%, 60%)'},{color: 'hsl(330, 100%, 70%)',label: 'hsl(330, 100%, 70%)'},{color: 'hsl(330, 100%, 80%)',label: 'hsl(330, 100%, 80%)'},{color: 'hsl(330, 100%, 90%)',label: 'hsl(330, 100%, 90%)'},],columns: 9,},language: 'zh-cn',//设置图⽚位置以及⼤⼩image: {styles: ['alignLeft', 'alignCenter', 'alignRight'],resizeOptions: [{name: 'imageResize:original',label: '原版',value: null},{name: 'imageResize:50',label: '50%',value: '50'},{name: 'imageResize:75',label: '75%',value: '75'}],toolbar: ['imageStyle:alignLeft', 'imageStyle:alignCenter', 'imageStyle:alignRight','|','imageResize','|','imageTextAlternative']},//表格配置table: {contentToolbar: ['tableColumn','tableRow','mergeTableCells']},//访问许可证密钥licenseKey: '',//图⽚上传ckfinder: {uploadUrl: 'http://192.168.31.123:2000/api/Home/UploadImg'},//⾃定义providers,给上传的视频链接设置相应的html,让其可以正常在富⽂本编辑器中显⽰ mediaEmbed: {providers: [{name: 'myprovider',],html: match => {//获取媒体urlconst input = match['input'];return ('<div style="position: relative; padding-bottom: 100%; height: 0; padding-bottom: 70%;">' +'<video controls="controls" autoplay name="media" style="position: absolute; width: 100%; height: 100%; top: 0; left: 0;">'+ `<source src="${input}" type="video/mp4">`+'</video>'+'</div>');}}]},//⾃定义字体fontFamily: {options: ['default','Blackoak Std','宋体,SimSun','新宋体,NSimSun','⿊体,SimHei','微软雅⿊,Microsoft YaHei','楷体_GB2312,KaiTi_GB2312','⾪书,LiSu','幼园,YouYuan','华⽂细⿊,STXihei','细明体,MingLiU','新细明体,PMingLiU']},}//初始化编辑器实例1ClassicEditor.create( document.querySelector( '#editor' ), config).then( editor => {window.editor = editor;} ).catch( error => {} );//初始化编辑器实例2ClassicEditor.create( document.querySelector( '#editor2' ), config).then( editor => {window.editor2 = editor;} ).catch( error => {} );window.onload = function(){document.getElementById("btn").onclick = function(){//获取内容数据,以及给获取的内容数据中的oembed替换成videowindow.str = window.editor.getData().replace(/oembed url/g,'video controls src').replace(/oembed/g,'video')console.log(window.str);}//给编辑器插⼊内容document.getElementById("btn2").onclick = function(){// //初始化编辑器中的数据;window.editor.setData('')//对插⼊的内容进⾏转换,将video标签转换为oembed标签var newContent = window.str.replace(/<video controls src=/g,'<oembed url=').replace(/<\/\video>/g,'<\/\oembed>')//将数据转换为⽂档⽚段var viewFragment = window.editor.data.processor.toView( newContent );//对转换的数据进⾏包裹var modelFragment = window.editor.data.toModel( viewFragment );//插⼊到编辑器中window.editor.model.insertContent( modelFragment );}document.getElementById("btn3").onclick = function(){}}。