Replacing document.documentElement.innerHTML in Internet Explorer
The following works flawlessly (as far as I can tell) in all other browsers:
document.documentElement.innerHTML = "<head></head><body>Testing</body>";
But chokes in IE (I tested IE9), with a console error:
SCRIPT600: Invalid target element for this operation.
…referencing the first character of the line of code above.
Why won’t this work in IE, but will work in all other browsers? I read somewhere that
innerHTML has issues replacing ‘TBODY’ elements, but I tested this line of code after removing all TBODY children and the same error occurred.
I know this sounds like bad-news-code, but it is the only option I have left with the very limited and simplistic CMS website we are being forced to use. I’m only thankful that the CMS allows scripts to be executed.
In essence, I need to be able to completely gut the HTML contents and use my own. Again, this works fine on other browsers.
- The CMS is using the
prototype.jslibrary (it’s already loaded before I run this code)
- The Doctype is:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- The CMS scripts use
prototype.jsto dynamically add two
divs full of content at page load
One Solution collect form web for “Replacing document.documentElement.innerHTML in Internet Explorer”
As both @duri and I confirmed, the
<html>) object along with a handful of other certain HTML elements are read-only in Internet Explorer (see link in first comment), and therefore replacing the
documentElement in a cross-browser fashion is not possible.
script tags from the
head, then to set the
body attributes to match the replacement content, then to replacing the
innerHTML of the
body, and finally dynamically adding my own
css tags as children of the
head, achieves nearly the same thing.
Thanks to @duri for the workaround tip!