HTML onload 이벤트 속성

❮ HTML 이벤트 속성

예시

페이지가 로드된 직후 JavaScript를 실행합니다.

<body onload="myFunction()">

아래에서 더 많은 "직접 사용해 보기" 예를 살펴보세요.


정의 및 사용

onload 속성은 객체가 로드되었을 때 발생합니다.

onload는 웹 페이지가 모든 콘텐츠(이미지, 스크립트 파일, CSS 파일 등 포함)를 완전히 로드한 후 스크립트를 실행하기 위해 <body> 요소 내에서 가장 자주 사용됩니다. 그러나 다른 요소에도 사용할 수 있습니다(아래 "지원되는 HTML 태그" 참조).

onload 속성은 방문자의 브라우저 종류와 브라우저 버전을 확인하고, 해당 정보를 기반으로 웹페이지의 적절한 버전을 로드하는 데 사용할 수 있습니다.

onload 속성은 쿠키를 처리하는 데 사용할 수도 있습니다(아래 "추가 예" 참조).


브라우저 지원

Event Attribute
onload Yes Yes Yes Yes Yes

통사론

<element onload="script">

속성 값

Value Description
script The script to be run on onload

기술적 세부 사항

지원되는 HTML 태그: <body>, <frame>, <frameset>, <iframe>, <img>, <input type="image">, <link>, <script> 및 <style>

더 많은 예

예시

<img> 요소에 onload 사용. 이미지가 로드된 직후 "이미지가 로드되었습니다" 경고:

<img src="w3html.gif" onload="loadImage()" width="100" height="132">

<script>
function loadImage() {
    alert("Image is loaded");
}
</script>

예시

onload 이벤트를 사용하여 쿠키 처리("고급" 자바스크립트 사용):

<body onload="checkCookies()">

<p id="demo"></p>

<script>
function checkCookies() {
    var text = "";
    if (navigator.cookieEnabled == true) {
        text = "Cookies are enabled.";
    } else {
        text = "Cookies are not enabled.";
    }
    document.getElementById("demo").innerHTML = text;
}
</script>

관련 페이지

HTML DOM 참조: onload 이벤트


❮ HTML 이벤트 속성