添加另一个样式而不删除前一个（CKEditor 4）

Question

我一直在查看大量的文档和示例，但我没有找到答案。这是我的问题，我在CKEditor stylesSet中有以下代码：

{name: 'Full Column Photo', element: 'img', attributes: { 'class': 'full-
column' }, childRule: function( element ) {
    return !element.is( 'img' );
}},
{ name: 'Disable Image Popup', element: 'img', attributes: { 'class': 
'disable-popup' }, childRule: function( element ) {
return !element.is( 'img' );
} },

如果我有一个具有样式/类“.full-column”的元素，然后将样式/类“.disable-popup”添加到同一个元素，则会删除“.full-column”。如何在元素中保留两个类？如果之前已经为元素选择了样式/类，我该如何才能删除它。

所有帮助非常感谢。

Answer 1

在JavaScript中，您可以使用classList属性将类添加到元素现有类列表中。该属性公开了add函数，该函数可用于向列表中添加新的类名。

首先需要获得对要操作的DOM元素的引用。

const el = document.getElementById('some-element');

接下来，您可以将所需的类添加到元素中

el.classList.add('new-class');

或者，如果您想稍后删除该类，则可以使用remove函数。

el.classList.remove('new-class');

---

编辑：根据您的评论，您是否能够将attributes.class属性指定为返回您拥有的对象的函数。就像是：

{ 
    name: 'Disable Image Popup', 
    element: 'img', 
    attributes: { 
          'class': function() {
            element.addClass('disable-popup');
            return '';
        }
    }, 
    childRule: function( element ) {
        return !element.is( 'img' );
    }
}

奇怪的是，我不认为有一个函数会返回元素上的CKEDITOR.dom.element类，只返回样式或hasClass()函数。