HTML 온로드 속성
정의 및 사용
onload 속성은 객체가 로드되었을 때 발생합니다.
onload는 웹 페이지가 모든 콘텐츠(이미지, 스크립트 파일, CSS 파일 등 포함)를 완전히 로드한 후 스크립트를 실행하기 위해 <body> 요소 내에서 가장 자주 사용됩니다. 그러나 다른 요소에도 사용할 수 있습니다(아래 "지원되는 HTML 태그" 참조).
입력 요소의 경우 onload 속성은 <input type="image">인 경우에만 지원됩니다.
onload 속성은 방문자의 브라우저 종류와 브라우저 버전을 확인하고, 해당 정보를 기반으로 웹페이지의 적절한 버전을 로드하는 데 사용할 수 있습니다.
에 적용
onload 속성은 이벤트 속성 의 일부이며 다음 요소에서 사용할 수 있습니다.
집단 |
---|
<본체> |
<아이프레임> |
<img> |
<입력> |
<링크> |
<스크립트> |
<스타일> |
예
바디 예시
페이지가 로드된 직후 JavaScript를 실행합니다.
<body onload="myFunction()">
이미지 예
<img> 요소에 onload 사용. 이미지가 로드된 직후 "이미지가 로드되었습니다" 경고:
<img src="w3html.gif" onload="loadImage()" width="100" height="132">
<script>
function loadImage() {
alert("Image is loaded");
}
</script>
입력 예
<input type="image"> 요소에서 onload 사용. 이미지가 로드된 직후 "이미지가 로드되었습니다" 경고:
<input type="image" onload="loadImage()" src="img_submit.gif" alt="Submit">
<script>
function loadImage() {
alert("Image is loaded");
}
</script>
브라우저 지원
특성 은 onload
각 요소에 대해 다음 브라우저 지원을 가집니다.
Element | |||||
---|---|---|---|---|---|
body | Yes | Yes | Yes | Yes | Yes |
iframe | Yes | Yes | Yes | Yes | Yes |
img | Yes | Yes | Yes | Yes | Yes |
input type="image" | Yes | Yes | Yes | Yes | Yes |
link | Yes | Yes | Yes | Yes | Yes |
script | Yes | Yes | Yes | Yes | Yes |
style | Yes | Yes | Yes | Yes | Yes |