- 전체
- HTML
- Web Design (웹디자인)
- XE 응용 개발
- wordpress plugin dev
- Javascript & JavaScript Application
- MEAN Stack : full stack javascript
- angular js & ionic framework
- bootstrap
- WebGL, Three.js and Babylon.js
- restful api design
- mobile web
- node.js 응용
- Cloud Service 응용
- 웹 어셈블리 개발 [WASM, WebAssembly]
- 마이크로서비스, MSA (microservice architecture)
- WebGL / WebGPU
- next.js 개발
- micro frontend (마이크로프론트앤드)
- 전자상거래/쇼핑몰
- 서버 클라우드 (aws, azure, google)
[javascript, 자바스크립트] 자동 실행 함수 (window.onload, $(document).ready())
카테고리 없음 2017. 8. 30. 16:57
요약
window.onload 와 $(document).ready() 중에 어느 한 쪽이 좋다고 할 수 없다.
window.onload 는 페이지의 모든 요소들이 로드된 이후에 호출되며
$(document).ready() 는 DOM 요소들만 로드되면 호출된다.
window.onload 는 한 페이지에 하나의 함수만 호출되지만
$(document).ready() 는 모두 호출된다.
위와 같은 특징들을 파악하여 경우에 따라 적절히 골라서 쓰자.
window.onload
Javascript에서 페이지가 로드되면 자동으로 실행되는 함수를 구현할 때엔
전역 콜백함수인 window.onload 함수를 사용합니다.
※ 자바스크립트 전역 콜백함수: http://zuyo.tistory.com/337
실행시점
페이지가 모두 로드된 시점
특징
1. 페이지의 모든 요소들이 로드되어야 호출된다.
2. 한 페이지에서 하나의 window.onload()함수만 적용된다.
사용법
아래와 같이 익명함수 형태로 사용한다.
window.onload = function () {
}
$(document).ready()
jQuery는 자바스크립트의 window.onload 함수의 문제점을 해결하기 위해 $(document).ready() 함수를 제공한다.
실행시점
DOM이 모두 로드된 시점
특징
1. 외부 리소스 및 이미지 로딩과 상관없이 DOM만 로드되면 바로 실행된다.
2. 중복 사용해도 순서대로 모두 실행된다.
사용법
$(document).ready(function(){
});
or 생략하면..
$().ready(function(){
});
or 더 생략하면..
$(function(){
});
[출처] https://zuyo.tistory.com/525
본 웹사이트는 광고를 포함하고 있습니다.
광고 클릭에서 발생하는 수익금은 모두 웹사이트 서버의 유지 및 관리, 그리고 기술 콘텐츠 향상을 위해 쓰여집니다.
광고 클릭에서 발생하는 수익금은 모두 웹사이트 서버의 유지 및 관리, 그리고 기술 콘텐츠 향상을 위해 쓰여집니다.
댓글 0
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 수 |
|---|---|---|---|---|
| 1 |
jQuery Mobile Form Example
| 졸리운_곰 | 2018.09.04 | 428 |

