-
Hello World로 시작하기Development/Javascript 2016. 3. 10. 13:20
프로그래밍을 처음으로 시작했다면 가장 먼저 해보는 것이 아마 Hello World 일 것입니다.
그래서 처음 시작하는 마음으로 JavaScript를 이용해서 Hello World를 출력해보겠습니다.
* 목표 : Hello World를 JavaScript로 출력하기
먼저 index.html 파일 하나를 만들어 줍니다.
<!DOCTYPE html> <html> <head> <title>No.1 Hello World</title> </head> <body> <div id = "content_area"> </div> </body> </head>위와 같이 빈 html 이 있습니다. html 파일을 실행해보세요.
브라우저에 아무것도 안나옵니다.
여기에 Java Script로 페이지가 로딩 될때 동적으로 Hello World를 출력하는 코드를 추가하면 되겠네요.
그래서 <script> 태그를 사용해서 아래와 같이 추가해줍니다.
<!DOCTYPE html> <html> <head> <title>No.1 Hello World</title> <script type="text/javaScript"> window.onload = function() { // 윈도우객체가 로드되면 아래를 실행하세요. document.getElementById('content_area').innerHTML= '<h1> Hello World </h1>'; // content_area를 ID로 가지는 DOM 객체를 가져와서 거기에 다음과 같은 HTML을 넣어주세요. }; </script> </head> <body> <div id = "content_area"> </div> </body> </html>자 이제 다시 한번 html 파일을 실행해보세요.
짠! Hello World 가 나타납니다.
지금까지 JavaScript로 Hello World 출력하기 였습니다.
'Development > Javascript' 카테고리의 다른 글
자바 스크립트와 CSS를 HTML에서 분리하기 (1) 2016.03.10