Resposta Difnt IE-8 e FF GetElementById ()

Question

Eu tenho uma função o que faz o seguinte

function test() {
    document.getElementById("main").innerHTML="show wait";

    // do stuff

    document.getElementById("main").innerHTML="show finished";
}

Em FF, o div mostrará "Show Wait", faça as outras coisas por 4 segundos e depois mostre "show terminado"

No IE, ele mostrará apenas "show acabado". Se eu colocar um alerta () depois ou antes do "fazer coisas", ele mostrará "Show Wait".

O que posso fazer para resolvê -lo, sei que posso dividir a função, qualquer outra soluções?

Answer 1

Leia a explicação de Richard sobre por que não funciona. Quanto a uma solução, um hack rápido:

function test() {
    document.getElementById("main").innerHTML="show wait";

    setTimeout(function(){
        // do stuff

        document.getElementById("main").innerHTML="show finished";
    },1)
}

A razão pela qual isso funciona é que setTimeout Agenda o código "Do Stuff" a ser executado posteriormente, permitindo que o navegador saia no modo de execução do script e entre no modo de renderização do DOM para que o "show wait" O texto pode ser desenhado na tela.

Answer 2

O IE não está mostrando atualizações até que você retorne o segmento de controle ao navegador. Uma chamada para alerta fará isso (seu script aguarda uma ação do usuário).

Não confie nas alterações visíveis da interface do usuário enquanto você tem o encadeamento da execução ou faça algo como usar um cronômetro para continuar a segunda parte do seu script após (brevemente) devolver o encadeamento da execução.