如何在CKEDITOR内改变CSS样式规则（例如通过jQuery）。

Question

我花了很多时间在CKEDITOR中费尽心思的修改CSS规则，在飞行中。但结果还是不能令人满意:-)。

我想从CKEDITOR中选择DOM元素并设置CSS样式。然后我想保存CSS的信息(以便重新使用文档)。

我读到过，最好的方法是使用jQuery。我试过，但不成功。有什么办法吗？

非常感谢。

Answer 1

我觉得可以用'dataProcessor'来实现。

CKEDITOR.replace('editor1', {
   on: {
      pluginsLoaded: function(event) {
         event.editor.dataProcessor.dataFilter.addRules({
            elements: {
               a: function(element) {
                  var attr = element.attributes;
                  if(attr.href && attr.href.indexOf('#') === -1) {
                     element.attributes.target = '_blank';
                  }
               },
               // remove script
               script: function(element) {
                  return false;
               }
            }
         });
      }
   }
});

文档。http:/docs.ckeditor.com#！apiCKEDITOR.editor-property-dataProcessor。

Answer 2

对于CKEDITOR4来说，你可以将CSS规则作为文本附加在上面，如

const styles = `
  .example-css-selector {
    padding: 3px 5px;
    color: red;
    border-radius: 3px;
  }`;
editor.document.appendStyleText(styles);