Going Deep Inside with Javascript

Came across a problem where I need to get the text value from the open source editor plug-in for web page, FCK Editor, the problem is I can’t use server script that came with the editor, because we need to do some data populating using Javascript.

The editor is using a lots of script, styles and it uses iframes, it is a iframe on our page, and inside itself, it got it’s own iframe, and it does not use text area or text box to do the text editing, it store the text we key inside body tag, this can be easily find out by using IE8, Safari or Chrome’s developer tools, and drill into the element.

The FCK Editor used 1 iframe, beside the one contained the whole editor. In order to retrieve the text value by using Javascript, we have to go in two frames and get the innerHTML of the body tag.

Here is it:

window.frames[0].window.frames[0].document.body.innerHTML;

The first frames[0] is to get the FCK Editor in our page, since our page only having one frame, which is FCK itself, the second frames[0] is the first iframe used inside the FCK Editor.

That snippet will return the text in the FCK Editor. Having fun with Javascript 🙂