javascript는 JQuery의 Ready 메소드 구현을 시뮬레이션하고 문제를 일으킵니다_javascript 기술

dom이 로드된 후 실행됩니다. 인터넷에서 일부 메소드의 논리에 대한 이해가 부족하여 "Jquery Source Code Research(ready function)"라는 기사를 읽고 작성했습니다. 다음 코드는 직접 작성했습니다(자세한 설명은 기재했습니다)

코드 복사 코드는 다음과 같습니다.

/xhtml">




>
< ;body>

테스트

jq와 함께하고 싶어서 비교를 위해 테스트할 때 jq 라이브러리를 import해야 합니다. 함수 자체는 jq를 호출하지 않으므로 자유롭게 인용해 주시기 바랍니다.

캡슐화를 통해 코드를 완성했는데, Darren.ready(fn)로 바로 실행이 가능합니다.

테스트를 통과한 후에도 여전히 이상한 문제가 발생했습니다. FF의 실행 순서는 jq -> 즉, onload 이벤트가 실행되기 전에 내 함수가 트리거될 수 있지만 jq가 준비된 것보다 늦습니다. 그래도 이 정도면 꽤 만족스럽습니다.

그러나 IE에서의 테스트는 다음과 같습니다: jq -> 즉, 내 함수가 코드를 향상시킬 수 있지만 onload 이벤트가 실행된 후에도 여전히 트리거된다는 점은 수수께끼입니다.

동지들, onload 전 실행 구현 방법과 jq 구현 방법을 설명해 주세요. jq의 구조를 완벽하게 시뮬레이션했는데, 그래도 중간에 누수가 발생하는 걸까요?

아래 코드를 참고하셔도 됩니다

코드 복사


코드는 다음과 같습니다

var Ready=function(readyCall) {
if(document.addEventListener)
document.addEventListener("DOMContentLoaded",function() {
document.removeEventListener("DOMContentLoaded",arguments .callee,false);
readyCall()
},false);
else if(document.attachEvent) {//IE의 경우
if(document.documentElement.doScroll && window.self==window.top) {
(function() {
try {
document.documentElement.doScroll("left");
}catch(ex) {
setTimeout(arguments.callee,5)
return;
}
readyCall();
})();
}else {//늦을 수도 있지만 iframe의 경우에도
document.attachEvent("onreadystatechange",function() {
if(document.readyState==="complete") {
document. detachEvent("onreadystatechange", 인수.callee)
readyCall()
}
});
}
}
}