Как некоторые редакторы WYSIWYG сохраняют форматирование вставленного текста?

как некоторые редакторы WYSIWYG сохраняют форматирование вставленного текста? Например, я скопировал курсивный красный текст из текстового редактора в WYSIWYG, и он сохранил цвет и стиль текста, как это происходит? Дольше всего я думал, что JavaScript имеет доступ только к тексту клипбордов. Разве это не так? Если так, то что это?

4 ответов


есть тип контента переговоров между источником и целью во время операции копирования/вставки. Это происходит примерно так:

  1. вы копируете что-то в буфер копирования и вставки. Скопированные данные помечены более или менее типом MIME и тем, кто их туда поместил.
  2. когда вы вставляете, цель вставки сообщает системе копирования и вставки, что она понимает определенный список типов MIME.
  3. система копирования и вставки соответствует доступным форматам к нужным форматам и находкам text/html в обоих списках.
  4. кто-то (возможно, исходный источник данных) затем преобразует буфер вставки в text/html и бросает его в Редакторе.

это в значительной степени то, как все работало, когда я делал разработку X11 / Motif (Эй! убирайтесь с моей лужайки, гнилые дети!) поэтому я бы предположил, что все делают это почти одинаково.


JavaScript не имеет прямого доступа к буферу обмена в целом. Однако все основные браузеры, выпущенные за последние несколько лет, имеют встроенное средство редактирования WYSIWYG через contenteditable атрибут / свойство любого элемента (что делает только этот элемент редактируемым) и designMode свойство объектов документа (что делает весь документ редактируемым).

пока пользователь редактирует содержимое страницы, если они вызывают вставку (с помощью сочетаний клавиш, таких как Ctrl + V или Shift + вставить или через меню "Правка" или "контекст"), браузер автоматически обрабатывает весь процесс вставки без какого-либо вмешательства JavaScript. Часть этого процесса включает в себя сохранение форматирования, где это возможно.

однако HTML, который это производит, может быть ужасным и сильно варьируется между браузерами. Многие редакторы WYSIWYG, такие как TinyMCE и CKEditor, используют хитрости перехватить вставленное содержимое и очистить его, прежде чем он достигнет редактируемой области редактора.


то, что вы видите-это богатый текстовый редактор. В этой статье Википедии есть некоторая информация:http://en.wikipedia.org/wiki/Online_rich-text_editor


Я думаю, что он скопировал выбранный DOM вместо