[javascript] 페이지가 완전히로드되었을 때 기능을 실행하는 방법은 무엇입니까?

페이지가 완전히로드되면 JavaScript 코드를 실행해야합니다. 여기에는 이미지와 같은 것들이 포함됩니다.

DOM이 준비되었는지 확인할 수 있지만 페이지가 완전히로드 된 시점과 같은지 모르겠습니다.

답변

이라고 load합니다. DOM 준비가 끝나기 전에 와서 실제로 왔으며 DOM 준비는 실제로 load이미지 를 기다린 정확한 이유로 만들어졌습니다 .

window.addEventListener('load', function () {
  alert("It's loaded!")
})

답변

일반적으로을 사용할 수 window.onload있지만 window.onload뒤로 / 앞으로 가기 기록 단추를 사용할 때 최신 브라우저가 실행되지 않는 것을 알 수 있습니다 .

어떤 사람들 은 이 문제를 해결하기 위해 이상한 왜곡을 제안 하지만 실제로 window.onunload핸들러를 만들면 (아무 것도하지 않는 핸들러조차도) 모든 브라우저 에서이 캐싱 동작이 비활성화됩니다 . MDC는 꽤 잘이 “기능”을 문서화하지만, 어떤 이유로 사용하는 사람들 거기에 여전히 setInterval다른 이상한 해킹.

일부 Opera 버전에는 페이지 어딘가에 다음을 추가하여 해결할 수있는 버그가 있습니다.

<script>history.navigationMode = 'compatible';</script>

뷰당 한 번만 호출되는 (그리고 DOM로드가 완료된 후가 아니라) 자바 스크립트 함수를 얻으려는 경우 다음과 같이 할 수 있습니다.

<img src="javascript:location.href='javascript:yourFunction();';">

예를 들어,이 트릭을 사용하여 로딩 화면에서 매우 큰 파일을 캐시에 미리로드합니다.

<img src="bigfile"
onload="this.location.href='javascript:location.href=\'javascript:doredir();\';';doredir();">

답변

완성도를 높이기 위해 DOMContentLoaded에 바인딩 할 수도 있습니다. 이제 DOMContentLoaded가 널리 지원됩니다.

document.addEventListener("DOMContentLoaded", function(event){
  // your code here
});

자세한 정보 : https://developer.mozilla.org/en-US/docs/Web/Events/DOMContentLoaded

답변

전체 페이지가로드 된 후에 만 실행하십시오.

자바 스크립트로

window.onload = function(){
    // code goes here
};

Jquery 작성

$(window).bind("load", function() {
    // code goes here
});

답변

이 코드를 사용해보십시오

document.onreadystatechange = function () {
  if (document.readyState == "interactive") {
    initApplication();
  }
}

자세한 내용 은 https://developer.mozilla.org/en-US/docs/DOM/document.readyState 를 방문 하십시오.

답변

이미지 등을 포함한 모든 것이로드되면 window.onload 이벤트가 발생합니다.

js 코드를 가능한 빨리 실행하려면 DOM 준비 상태를 확인하고 싶지만 여전히 DOM 요소에 액세스해야합니다.

답변

onLoad()이벤트를 사용하는 Javascript 는 페이지가로드되기를 기다렸다가 실행합니다.

<body onload="somecode();" >

jQuery 프레임 워크의 문서 준비 기능을 사용하는 경우 DOM이로드 되 자마자 페이지 내용이로드되기 전에 코드가로드됩니다.

$(document).ready(function() {
    // jQuery code goes here
});