innerHTML and createContextualFragment problems when Firefox renders XHTML
If any of you use Firefox, then you’ll have noticed that the “Preview Comment” feature doesn’t work anymore. It stopped working after I converted this site over to XHTML. Initially it worked (even though it validated as XHTML 1.1) because I was setting the mime-type to text/html. To make it completely compliant, I set the mime-type (for browsers that accept it) to application/xhtml+xml. This made certain things break in Firefox. Namely, innerHTML. HTMLElement.innerHTML isn’t a W3C standard anyway, so it would make sense that it wouldn’t work. However, it was not so much an error as it is a bug in Mozilla (or in Gecko).
I looked around for some alternatives and chanced upon the createContextualFragment function. It is supposed to work, but I guess those examples were for Firefox when it didn’t support the innerHTML property in HTML. I tried something like this:
var range = div_preview.ownerDocument.createRange(); range.selectNodeContents(div_preview); range.deleteContents(); var fragment = range.createContextualFragment(comment); //<-- will crash here div_preview.appendChild(fragment);
I don’t have any other alternatives than to
- Wait for Firefox 1.1
- Parse the code I want to insert through an XML parser, and then create the objects through DOM Core methods
I figure I’ll try the option b for now, but I don’t know how the slow the parsing will be. I guess I won’t know until I try.