How does one go about writing a simple WYSIWYG editor in JavaScript?

Question

In my project I need to write small WYSIWYG editor (just let users make text bold/italic/underline and maybe some more). So I wouldn't like to use monsters like tinymce or fckeditor. My question is what HTML elements and javascript functions do I need to know for it? An HTML element in which I can edit and format text is a very interesting thing in this question.

Answer 1

document.getElementById('edit').contentDocument.designMode = "on";

Have a look at http://www.mozilla.org/editor/ie2midas.html

Answer 2

If you want to roll your own, look at Midas. It's available in FF3+, IE, Safari, Opera, Chrome.

Basically, you use contentEditable and execCommand to turn the browser into an RTE.

Answer 3

I've used YUI's wysiwyg editor in the past and it lets you configure the the buttons so you could easily use it and limit the buttons to bold/italic/underline.

Answer 4

Alternatively use simple languages like markdown or textile and provide a live preview.

I think most people will get asterisks for emphasis and double ones for bolding.