JavaScript的DOM操作后强制Internet Explorer中的DOM刷新(Forcin

这里的情况。我有一些JavaScript，看起来像这样：

function onSubmit() {
    doSomeStuff();
    someSpan.style.display="block";
    otherSpan.style.display="none";
    return doLongRunningOperation;
}

当我做这个表单提交的动作，并从非IE浏览器中运行它，它很快就交换了两个跨的知名度和运行长的JavaScript运行。如果我这样做，在IE中它不会做掉，直到之后的onsubmit（）完全返回。

我可以强制DOM通过像这样坚持一个警告框重绘：

function onSubmit() {
    doSomeStuff();
    someSpan.style.display="block";
    otherSpan.style.display="none";
    alert("refresh forced");
    return doLongRunningOperation;
}

此外，明显的jQuery重构不影响IE浏览器的行为：

function onSubmit() {
    doSomeStuff();
    $("#someSpan").show();
    $("#otherSpan").hide();
    return doLongRunningOperation;
}

这种现象存在于IE8和IE6。反正是有强制在这些浏览器的DOM的重绘？

Answer 1:

您可以将longRunningOperation异步调用？

Answer 2:

Mozilla的（也许IE一样）将缓存/延迟执行影响显示更改DOM，以便它可以计算所有一次，而不是重复每一个语句之后的变化。

要强制更新（强制立即同步回流或重新布局），你的JavaScript应当阅读真实受变化的特性，如someSpan和otherSpan的位置。

（该Mozilla实现细节在视频中提到更快的HTML和CSS：网页开发人员布局引擎内核）。

Answer 3:

要继续ChrisW说什么：

这里的冲洗脚本闪烁DOM，所以你不必呼叫警报（“”）做; （在发现http://amolnw.wordpress.com/category/programming/javascript/ ）：

function flushThis(id){
   var msie = 'Microsoft Internet Explorer';
   var tmp = 0;
   var elementOnShow = document.getElementById(id);
   if (navigator.appName == msie){
      tmp = elementOnShow.parentNode.offsetTop  +  'px';
   }else{
      tmp = elementOnShow.offsetTop;
   }
}

这个对我有用！！！ 谢谢你的提示。

Answer 4:

我在Chrome 21有这个问题，拖动了一封信，下降器（“G”）一词。它的屏幕，这将消失，下一次做的东西在屏幕刷新上留下的尘埃虫蛀痕迹后面。 ChrisW的解决方案（询问布局敏感的特性）没有工作。

什么做的工作是在页面的顶部添加一个1像素的空白格，然后一毫秒后删除它，通过调用在拖动操作结束下列功能：

// Needed by Chrome, as of Release 21. Triggers a screen refresh, removing drag garbage.
function cleanDisplay() {
    var c = document.createElement('div');
    c.innerHTML = 'x';
    c.style.visibility = 'hidden';
    c.style.height = '1px';
    document.body.insertBefore(c, document.body.firstChild);
    window.setTimeout(function() {document.body.removeChild(c)}, 1);
}

注意：您需要的延迟。简单地添加和删除div不起作用。此外， div需要，需要重新绘制的页面部分上面以复加。

Answer 5:

你也可以换你在一个长期的setTimeout功能（功能（）{长期（）;}，1）;

Answer 6:

element.focus（）对我的作品在IE10

function displayOnOff(){
    var elm = document.getElementById("myDiv");
    elm.style.display="block";
    elm.focus();
    for(var i=0; i<1000000; i++){
        console.log("waiting...............");
    }
    elm.style.display = "none";
}

文章来源: Forcing a DOM refresh in Internet explorer after javascript dom manipulation