InnerHTML IE8 error

Question

This innerHTML code did not work reliably in IE8: (but it worked in IE6 IE7 FF Opera Chrome Safari) (not working reliably, I mean that I placed this code inside onmouseover handlers on different elements, sometimes it would change the text when manipulating by this element, and sometimes not - there was no template for this - whether it would work or did not seem completely random)

document.getElementById("mydiv").innerHTML="some text"; 

The DOM methods (deleting and re-adding divs with updated text) also did not help.

So, I added this right after the above code, and he fixed it:

 document.styleSheets[0].addRule("#mydiv:after", "content: ' ';"); 

Using conditional comments, I defined this second line of code as IE8 only

I am sure this will save people a lot of time since I wasted it! Even Jquery.text() didn't help!

I read elsewhere that innerHTML will update the DOM, but may not update the screen elements. I believe the CSS rule works because it dynamically changes the contents of the #mydiv pseudo-class and therefore requires updating the contents of mydiv, thereby updating the screen (something innerHTML was not running).

However, if anyone has a better solution, I would like to hear - Thanks

RECOMMENDED TO ASK

Answer 1

You can use innerText instead of innerHTML