setimeout 후 removeChild가 산발적으로 작동합니까?

Question

안녕하세요.

body 클래스가 "loaded"로 변경 될 때 1000ms 지속되는 CSS 전환 (불투명도)을 통해 페이드 아웃 된 로더가 있고 전환이 완료되면 나는 DOM.

바 osx 스노우 레오파드/구글 크롬 v28 모두에서 잘 작동하는 다음 스크립트를 사용 중입니다. 심지어 몇 명의 사람들 만 사용할 수 있습니다. 내 클라이언트와 거의 모든 사람들이 똑같은 설정을했습니다. 나는 시험 할 수있다 - 그리고 그것은 잘 작동한다.

하지만 로더가 DOM에서 제거되지 않는 버그보고가 2 개 또는 3 개 있었기 때문에 나머지 콘텐츠를 여전히 오버레이하여 그 아래에있는 요소를 클릭 할 수 없게 만듭니다. 한 종류의 사용자는 심지어 로더 요소가 여전히 DOM에 있음을 확인하는 비디오를 보냈습니다.

스크립트는 다음과 같습니다. 나는 그 요소를 어떻게 제거했는지 또는 setTimeout 함수 구문 자체에 문제가있을 수 있는지 궁금하다.

왜 이것이 아마도 실패 할 수 있는지에 대한 도움이 필요합니다. 특히 이것을 복제 할 수 없다고 생각하면 좋습니다! 스크립트에서 어떻게 작동하는지 (그리고 대부분은 어떻게 작동하는지) 설명하는 주석을 추가했습니다.

var 
loaded = false, 
_body = document.body, 
loader = document.getElementById("loader"), 
kill_loader = function() { 
    if (loader) { 
     loader.parentNode.removeChild(loader); 
    } 
}, 
cl = function() { 
    // set loaded to true, add class to body that fades the loader, then remove the loader 
    loaded = true; 
    _body.className = _body.className + " loaded"; 
    // the above works as intended 
    setTimeout(kill_loader,1000); 
    // this last bit does not seem to work in rare instances as detailed. 
    // the timeout is so that the loader fully fades before being removed. 
}; 

window.onload = function() { 
    if (!loaded) { 
    // if loaded variable is false (i.e. cl() has not run), call the function to complete loading 
     cl(); 
    } 
}; 


setTimeout(function() { 
    // if page still not loaded after 5 seconds, force the load 
    if(!loaded) { 
     cl(); 
    } 
},5000); 

미리 도움을 주셔서 감사합니다.

Answer 1

ok 솔루션은 내 스크립트 자체와 관련이 없지만 설치 한 크롬 플러그인 (measureIt.js)이 내 스크립트를 죽이기 때문에 해결되었습니다. 훌륭한.

플러그인을 설치 한 상태에서 문제 (OSX 또는 크롬 버전으로 제한되지 않음)를 복제하고 로더를 제거하기위한 간단한 try catch 문을 추가했습니다.

구문을 깔끔하게 정리해 주신 Crazy Train에 감사드립니다. 문제가 좀 더 쉽게 분리되었습니다.