createElement：如何使这个跨浏览器 - 在IE10中工作

Question

我有以下javascript，它是在页面空闲时触发和创建的加载程序。它基本上显示下一个导航页面正在加载。该脚本驻留在（ASP.NET）母版页和Ajaxified用户控件上。

我需要让代码跨浏览器但不确定违法者是什么。

它只适用于Trident（仅测试IE9和10） - 不适用于Webkit或Gecko。

我不确定这是否是一个符号问题，或者Chrome和Safari的页面生命周期是否都没有声明为“！=完成”，因此不会触发该条件。

我也希望保持这个纯粹的Javscript解决方案 - 没有jQuery。

由于

loader = 0;
if (window.location.href.indexOf("Login.aspx") < 0) {
    setInterval(function () {
        if (document.readyState != 'complete') {
            document.documentElement.style.overflow = "hidden";
            var navLoader = document.createElement("div");
            var loaderText = document.createElement("div");
            var loaderImg = document.createElement("div");
            navLoader.id = "navLoaderDiv";
            navLoader.className = "navLoader";
            loaderImg.id = "loaderImg";
            loaderText.id = "loaderText";
            loaderImg.className = "loaderImg";
            loaderText.className = "loaderText";
            navLoader.appendChild(loaderImg);
            navLoader.appendChild(loaderText);
            loaderText.innerHTML = "Working on it";
            var zedDepth = 99999;
            navLoader.style.zIndex = zedDepth;
            navLoader.style.background.image = "url(~/Images/loaderHalo2.png) 0 0 / 100% 100% no-repeat";
            navLoader.style.position = "absolute";
            navLoader.style.right = "0px";
            navLoader.style.left = "0px";
            navLoader.style.top = "25px";
            navLoader.style.bottom = "0px";

            if (loader == 0) {
                document.documentElement.appendChild(navLoader);
                loader = 1;
            }
        } else if (document.getElementById('navLoaderDiv') != null) {
            document.getElementById('navLoaderDiv').style.display = "none";
            document.documentElement.style.overflow = "hidden";
        }

    }, 1000)
}