replying to myself...
here's another testcase:
http://www.webdeveloper.com/forum/showthread.php?t=136331From additional testing, the IE bug
does not present itself when there is whitespace preceeding the first element, or a <br/> or an <hr/>... I haven't tried any other tags. But there's more weirdness... if you start the string with a div or span say: "<div> <style>...</style></div>" but leave whitespace before they style tag, the style will
still get stripped out. However, if you do the same but preceed the <div> with whitespace the <style> will not be removed.
Finally, some of the time a second style would also be removed, but it was even more capricious about when it would or would not remove it... if you adjust the textarea to be this:
- <textarea id="template"><style type="text/css">
.red_test { color: red; }
</style>
<div id="nav_controls" class="navControls">
<style type="text/css">
.blue_test { background-color: blue; }
</style>
<div id="test_div" class="red_test blue_test">A test</div>
</div>
</textarea>
both styles will be stripped, however if you do this:
- <textarea id="template"><style type="text/css">
.red_test { color: red; }
</style>
<div id="nav_controls" class="navControls">
<div id="test_div" class="red_test blue_test">A test</div>
</div>
<style type="text/css">
.blue_test { background-color: blue; }
</style>
</textarea>
The second style will survive.
- var style_test = document.createElement("div");
style_test.innerHTML = "<style></style>";
alert(style_test.innerHTML.length !== 0);
in the support code should successfully test for this condition. IE8 alerts a false and opera,chrome,ff,safari all alert true.
So, I guess you could write a case that says, value contains a style tag, and does not have leading spaces OR doesn't strip style, then proceed with innerHTML, otherwise use append().
I have to admit though, that even after looking at this for a couple of hours, I don't really fully understand whats and wherefores of this bug.