window.onload 에 여러개의 함수 추가하기

윈도우창의 로딩이 완료되었을 시점(onload 이벤트 발생시)에 함수를 호출하거나 스크립트를 실행하는 방법은 여러개가 있습니다만 그 중 4가지를 예로 들어 보겠습니다.

1. <body onload="실행스크립트">

body 태그의 onload 이벤트에 직접 실행할 스크립트를 써주는 방법입니다.

2. window.onload = function() {실행스크립트}

window.onload 이벤트에 실행할 스크립트를 할당하는 방법입니다.

1번과 2번의 경우에는 서로 혼용할 수가 없습니다. 서로 대체해 버리기 때문에 둘 중 하나만 실행되며 실행할 스크립트가 추가될 경우 해당 라인을 찾아서 수정해줘야 하는 번거러움이 있습니다.

2번의 경우도

window.onload = function(){함수1();}

window.onload = function(){함수2();}

위와 같이 코딩할 경우 함수2() 만 실행이 됩니다.

3. window.attachEvent("onload", 실행스크립트);

window 객체에 attachEvent 메소드를 이용해 추가하는 형식입니다.

4. function window::onload(){실행스크립트}

window.onload 이벤트에 실행할 스크립트를 추가하는 방법입니다.

3번과 4번은 1, 2번과 다르게 기존의 이벤트에 추가하는 형식입니다. 따라서 실행스크립트가 추가될 경우 기존 이벤트와 상관없이 추가되는 실행스크립트를 써주시면 됩니다.

window::onload(){함수1();}

window::onload(){함수2();}

위와 같이 코딩할 경우 함수1()과 함수2()가 차례대로 실행됩니다.

물고기 많은 바다