innerHTML bug IE8 [英] innerHTML bug IE8

问题描述

这个innerHTML代码在IE8中无法可靠地工作：
（但是在IE6 IE7中的Opera Chrome Safari）
（通过不可靠的工作我的意思是我把这个代码放在onmouseover处理程序各种元素，有时它会改变文本，当鼠标在一个给定的元素，有时它不会 - 没有模式 - 这是否工作或不似乎是完全随机的）

  document.getElementById（mydiv）。innerHTML =some text; 
  

DOM方法（删除和重新添加带有更新文本的div） / p>

所以我在上面的代码之后添加了它，并修复了它：

  document.styleSheets [0] .addRule（＃mydiv：after，content：'';）; 
 

使用条件注释我将此第二行代码标识为仅IE8

我是积极的，这将节省大量的时间，因为我浪费了这个年龄！
偶尔 Jquery.text（）不起作用！

将更新DOM，但可能无法更新屏幕元素。我相信CSS规则的工作原理，因为它改变了#mydiv的后伪类的内容，因此需要更新mydiv的内容，从而更新屏幕（innerHTML没有做）。

但是，如果任何人有更好的解决方案，我很乐意听到 -

根据要求修改

解决方案

您可以使用innerText代替innerHTML

This innerHTML code wasn't working reliably in IE8: (but was working in IE6 IE7 FF Opera Chrome Safari) (by not working reliably I mean I had placed this code within onmouseover handlers on various elements, sometimes it would change the text when mousing over a given element and sometimes it wouldn't - there was no pattern to this - whether it would work or not seemed to be totally random)

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

DOM methods (removing and re-adding the div with updated text) weren't helping either.

So I added this immediately after the above code and it fixed it:

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

Using conditional comments I identified this 2nd line of code as for IE8 only

I am positive this will save people a lot of time since I have wasted ages on this! Even Jquery.text() wasn't helping!

I have read elsewhere that the innerHTML will update the DOM but can fail to update screen elements. I believe the CSS rule works because it changes the content of the after pseudo class of #mydiv dynamically and thus requires the content of mydiv to be updated, thus updating the screen (something innerHTML was failing to do).

However if anyone has a better solution I'd love to hear - Thanks

EDITED AS REQUESTED

解决方案

You can use innerText in place of innerHTML

这篇关于innerHTML bug IE8的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！