Alternatives to execCommand

I'm looking to create a WYSIWYG editor, using jQuery as a framework from which I can use different methods to ease production.

I do actually have a working editor at the moment, and it's working well. I use an iFrame, and set it's designMode to on and go from there. However there are a few things which are nagging me.

Take as an example changing the font family of the selected text. At the moment I am using this:

editorDoc.execCommand('fontname', false, 'verdana');

…now that works fine: it shows the change correctly in the iFrame. However, when I actually look at the code (I copy any code inside the iFrame into a hidden input and then POST it) it开发者_StackOverflow中文版 produces

<font class="Apple-style-span" face="verdana">aasdf</font>

I realise that the first class of Apple-style-span is a webkit thing, which doesn't matter. The thing which is nagging me is the whole use of <font>.

Researching the execCommand it looks like it's not a standard, although most browsers do support it. It is old though, so I was wondering if anyone had heard or know of a better method of producing the same effect, with hopefully a more semantic code product. It would also be fantastic not to be limited to a iFrame, but to be able to use a <textarea> instead..

Many thanks in advance, Gareth

Edit: Could contentEditable help me with my aim to not use an iFrame?

You can do any manipulations you want with iframe's DOM using usual DOM methods. Look in the sources of TinyMCE if you need some insights.