1. 브라우저 객체 모델 : BOM(Browser Object Model) 





2. html페이지 실행순서


- window객체의 onload이벤트 속성

- html 페이지에 존재하는 태그가 화면에 올라가는 순간이 load가 완료되는 순간.

- 페이지 실행 순서



1) 웹브라우저는 위에서 아래로 태그를 차례대로 실행하고 화면에 출력한다. 

alert창을 먼저 보인다.

<!DOCTYPE html>

<html>

<head>

<meta charset="EUC-KR">

<title>Insert title here</title>

<script type="text/javascript">

alert("hello world!");

</script>

</head>

<body>

<h1>hello world.1</h1>

<h1>hello world.2</h1>

</body>

</html>



2) alert창을 body 중간에 넣는다.

<!DOCTYPE html>

<html>

<head>

<meta charset="EUC-KR">

<title>Insert title here</title>


</head>

<body>

<h1>hello world.1</h1>

<script type="text/javascript">

alert("hello world!");

</script>

<h1>hello world.2</h1>

</body>

</html>
; 한문장 나오고 alert창 나옴.


3) 스크립트를 마지막으로 

<!DOCTYPE html>

<html>

<head>

<meta charset="EUC-KR">

<title>Insert title here</title>


</head>

<body>

<h1>hello world.1</h1>

<h1>hello world.2</h1>

</body>


<script type="text/javascript">

alert("hello world!");

</script>

</html>


;

위에서 부터 순차적으로 ..!!


4) onload 이벤트 사용 시 

<!DOCTYPE html>

<html>

<head>

<meta charset="EUC-KR">

<title>Insert title here</title>

<script type="text/javascript">

window.onload = function(){

alert("hello world!");

}

</script>

</head>

<body>

<h1>hello world.1</h1>

<h1>hello world.2</h1>

</body>

</html>





















; 태그가 다 올라온 다음 onload 의 내용이 실행된다. !!






저작자표시

'WEB > Javascript' 카테고리의 다른 글

12. DOM - 문서 객체 가져오기  (0) 2013.04.16
11. DOM - 객체생성  (0) 2013.04.15
9. 생성자함수와 prototype  (0) 2013.04.15
8. 객체지향- 함수를 사용한 객체생성 예제  (0) 2013.04.15
7. 객체지향  (0) 2013.04.15

+ Recent posts

티스토리툴바