wysiwyg редактор своими руками

[platedz]

В принципе основной вопрос заключается в том, как же это можно реализовать как-то универсально. Т.е. О том как с помощью exec команд, я в общем и целом знаю, но этот способ удобен только на первый взгляд, в интернете таких примеров довольно много, но вот если мне скажем нужно добавить что-то свое, а самое главное, что если мне нужно изменить скажем цвет у текста, которому уже назначен какой-то цвет. Как это все пересчитать, определить свойства у родителей и тд.
Т.е. я хочу сделать обертку, скажем <span></span>, назначить скажем цвет, шрифт, и тд. Проверить нет ли конфликтов в свойствах с родителями.
Раньше встречал несколько интересных статей на эту тему, но теперь к сожалению не могу найти.
Подскажите, пожалуйста, уважаемые форумчане.

[danik.js]

, как же это можно реализовать как-то универсально

Это будет трудно. Кроссбраузерный wysiwyg -за пределами реальности ))
Хотя простенький может и можно сделать.

platedz, так в чем конкретно вопрос? Берите да делайте - определяйте свойства родителей, пересчитывайте.

[schmetterling]

platedz, вам поможет свойство contenteditable. И, возможно, вот эта статья:
http://habrahabr.ru/post/38077/

[platedz]

Спасибо, конечно, но это немного не то.
Т.е. как вставить, я понимаю, а вот как определить, что и где вставлено, как убрать лишние атрибуты, те. если я в 12345 оберну в span 123 и добавлю к нему стиль style="color: #fff;", а затем оберну 34 и добавлю ему span="color: #aaa;" Как переместить закрывающий и открывающий тег, и самое главное, если я добавлю span="color:#aaa;" еще и backgound: #fff;
Где-то рассмативались эти вопросы, но никак не могу найти где. Если кто-то подскажет, буду крайне признателен.

[schmetterling]

platedz, тогда вам нужно гуглить ещё и о Range-объектах. Вам не нужно текстовую вёрстку самому менять ни в коем случае) Просто указываете границы (или берёте их из выделения), создаёте Range-объект, а потом оборачиваете его в нужный span (спец. методом surroundContent).
Вот статья:
http://habrahabr.ru/post/55922/

Правда, эти объекты нативно не поддерживаются в ie < 9, но есть решение от гугла, с которой они поддерживаться будут:
http://code.google.com/p/ierange/

[cyber]

schmetterling, мне кажется про Range это будет лучше http://learn.javascript.ru/vydelenie...ge-i-selection

[schmetterling]

cyber, ну, что читал -- на то и кинул.

[platedz]

Большое спасибо, буду изучать.

[cyber]

schmetterling, кстати статья на хабре и учебника одинаковая?О_о
интересно , кто написал оригинал)

[schmetterling]

schmetterling, кстати статья на хабре и учебника одинаковая?О_о
интересно , кто написал оригинал)

Ну, статья на хабре датирована 2009-м годом, а по вашей ссылке -- 2012-м)