[javascript] TinyMCE에서 텍스트 에디터를 동적으로 변환하는 방법은?

24 Nov 2023

javascript

텍스트 에디터를 동적으로 변환하는 방법은 몇 가지가 있습니다. 다음은 몇 가지 방법의 예시입니다:

에디터 인스턴스 제어:

// 에디터 인스턴스 가져오기
var editor = tinymce.get('editorId');

// 에디터 모드 변경
editor.mode.set('text');

// 에디터 테마 변경
editor.setTheme('dark');

에디터 설정 변경:

// 에디터 설정 가져오기
var config = tinymce.activeEditor.settings;

// 에디터 플러그인 추가
config.plugins += ' code';

// 에디터 동작 변경
config.toolbar = 'custom';

// 설정 업데이트
tinymce.activeEditor.destroy();
tinymce.init(config);

CSS 스타일 변경:

// 에디터의 특정 요소 선택
var editorContainer = document.querySelector('.tox-tinymce');

// 스타일 변경
editorContainer.style.width = '500px';
editorContainer.style.height = '300px';

이는 텍스트 에디터를 동적으로 변환하는 몇 가지 간단한 예시일 뿐입니다. 실제로는 더 복잡하고 다양한 방법을 사용할 수 있습니다. TinyMCE의 문서를 참조하여 자신의 요구에 맞게 사용할 수 있는 방법을 찾아보는 것이 좋습니다.

참조: