Как работают текстовые редакторы и как бы вы создали базовый?

Question

Мне показалось, что я довольно хорошо знаю JavaScript, но потом я подумал о том, как работают многофункциональные текстовые редакторы, такие как CKeditor, и понял, что понятия не имею.

Я предполагаю, что кнопки каким-то образом подключаются через JavaScript к текстовой области, но как это размечено.

Есть ли что-то особенное в полнофункциональных текстовых редакторах в Интернете, или это просто модные js?

Answer 1

Множество fancy.js и то, что раньше было расширением MS для DOM под названием «contentEditable», которое в основном превращает любой элемент dom в простой текстовый редактор.JS позволяет делать такие вещи, как полужирный / курсив / шрифты / вставка других элементов DOM (таблиц, изображений и т. Д.).но все это в конечном итоге сводится к contentEditable.

Answer 2

Вы можете сделать это с помощью свойства contentEditable элемента div. Допустим, у вас есть кнопка жирного шрифта.Пользователь щелкает по нему, затем вы вызываете функцию js и открываете тег как <b>, когда пользователь нажимает обычную кнопку, вы закрываете его. То же самое с цветом.JQuery для легкой манипуляции с домом.

Answer 3

оформить заказ:

http://www -archive.mozilla.org / редактор / midasdemo /

и это: https://developer.mozilla.org/en/rich-text_editing_in_mozilla