CKEditor: класс или идентификатор для тела редактора

У меня есть экземпляр CKEditor на странице. Я пытаюсь дать телу CKEditor класс или идентификатор, чтобы он соответствовал некоторым стилям, определенным в таблице стилей.

Существует документация API, которая должна предоставлять доступ к соответствующим элементам DOM, но я не могу заставить ее работать. Все объекты, с которыми я пытаюсь выполнить запрос, оказываются undefined.

Кто-нибудь знает, как это сделать, или как правильно адресовать элементы CKEditor dom?

Изменить. Спасибо, ребята, ответ nemisj сделал это для меня, но по какой-то причине я не могу установить "принятую" галочку в этом вопросе.

Ответ 1

Хотя эта часть API не была перенесена из 2.x во время размещения этого вопроса, теперь проще использовать bodyId и bodyClass параметры конфигурации.

Конечно, объяснение nemisj является хорошим и может быть полезным для других вещей, но вы должны помнить, что каждый раз, когда вы переключаетесь с дизайна (на исходное представление), iframe уничтожается, поэтому вам нужно будет переназначьте свои атрибуты, если вы сделаете это вручную.

Ответ 2

Если вы говорите о CKEditor (версия 3), тогда есть возможность получить любой экземпляр DOM внутри самого редактора. Каждый экземпляр CKEditor имеет ссылку на документ с помощью свойства document.

var documentWrapper = edit.document;

Эта ссылка представляет собой общедоступную оболочку для всех узлов CKEditor, но также имеет прямую ссылку на ее node. Вы можете получить, получив свойство [ "$" ].

var documentNode = documentWrapper.$; // or documentWrapper['$'] ;

documentNode будет представлять экземпляр DOM документа node внутри iframe. После того, как у вас есть экземпляр DOM, вы можете делать все, что хотите, с DOM-структурой, добавлять, удалять, заменять классы, перестраивать и т.д. Например

documentNode.body.className = "zork";

Надеюсь, этого должно быть достаточно.

Ответ 3

У меня была такая же проблема сегодня, пытаясь установить bodyClass следующим образом:

CKEDITOR.replace('editor1', { fullPage: true, bodyClass: 'myClass'

});

Я обнаружил, что в этой версии (3.3.1), если вы установите fullpage = true, установка bodyId или bodyClass не будет работать, но если вы установите fullPage = false, это сработает.

Надеюсь, что это поможет.

Ответ 4

Из Руководство:

<static> {String|Array} CKEDITOR.config.contentsCss

Файл CSS, который будет использоваться для применения стиля к содержимому. Он должен отражать CSS, используемый на последних страницах, где должно использоваться содержимое.

config.contentsCss = '/css/mysitestyles.css';
config.contentsCss = ['/css/mysitestyles.css', '/css/anotherfile.css'];

Значение по умолчанию:

<CKEditor folder>/contents.css

Ответ 5

Не знаю этого редактора, но поскольку все они работают одинаково, вы, вероятно, не можете получить доступ к элементам DOM, созданным экземпляром, потому что они созданы после завершения загрузки страницы, а DOM также готов, Таким образом, любые новые элементы DOM, добавленные после этого, теоретически не будут существовать.

Тем не менее, вы можете попробовать редактор TinyMCE, у которого есть "партнерство" с javascript-библиотекой jQuery, чтобы манипулировать всем, что вы хотите, и редактором сам по себе легко изменить практически всеми способами.

Ответ 6

Ваши запросы могут возвращать undefined, потому что экземпляры редактора помещаются внутри iFrame, и ваш запрос там не ищет?

Ответ 7

В config.js, напишите этот код

config.bodyId = 'contents_id';

то вы видите идентификатор тела в Ckeditor, но если вы хотите получить доступ к этому идентификатору, используйте

$('#parent_id').find('iframe').contents().find('#within_iframe')

there $('#parent_id') означает form_id или любой родитель, который является просто способом доступа к iframe. следуйте этому коду, чтобы получить доступ к элементу iframe