얼럿창 띄우기
누구나 hello world와 시작하더만..
나도.. 안녕하세요 대신에 헬로 월드
헬로 자바스크립트 월드!
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>얼럿창 띄우기</title>
</head>
<script>
window.alert("hello world"); // or alert("hello world") 로 window 생략해도 가능
</script>
</head>
<body>
</body>
</html>
한번 해보세요.
백번 연습해야 손에 익는다네요..
연습만이 살길~!!
다들 이 정도는 사실 하시죠? 알아요..
자 이 아이를 이제 .html 파일로 저장 하고 더블클릭해 브라우저에 띄우면 페이지가 열림과 동시에 hello world가 나오네요
이젠 버튼을 클릭하면 알럿창 나오게 해보기
함수를 만들어서
버튼 클릭 하면 onclick이벤트를 걸어서 얼럿창을 띄울꺼에요
function 함수명(){
실행코드;
..
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>얼럿창 띄우기 : 버튼 클릭 시</title>
</head>
<script>
function showMsg(){
window.alert("hello world");
}
</script>
</head>
<body>
<input type="button" value="click" onclick="showMsg()">
</body>
</html>
이렇게 해서 저장하면 이젠 페이지에 click이라는 input value에 있는 텍스트로 이루어진 버튼이 있어요.
걜 클릭하면 이제 헬로 월드가 뜨네욤!
여기서 스크립트 위치가 주는 영향?
먼저 </head> 안쪽에
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>얼럿창 띄우기</title>
<script>
window.alert("hello world");
</script>
</head>
<body>
<input type="button" value="click">
</body>
</html>
를 넣는 것과
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>얼럿창 띄우기</title>
</head>
<body>
<input type="button" value="click">
<script>
window.alert("hello world");
</script>
</body>
</html>
실행해보면 무슨 차이가 있을까요?
한번 해보세요
위치에 따라 다른 점!!
해보고 우리 이야기해욤
확실히 렌더링은 순서가 :D
그럼 전 또 겁내 겁내 더 쉬운 예제 연습하러 올게요
'JavaScript' 카테고리의 다른 글
홀짝 구분 (0) | 2015.11.05 |
---|---|
더하기 빼기 (0) | 2015.11.04 |
[자바스크립트 연산자] - JavaScript Operator (0) | 2015.11.04 |
버튼 클릭하면 이미지 변경하기 (0) | 2015.11.04 |
입력한 글 얼럿창으로 띄우기 (0) | 2015.11.03 |