2013년 7월 9일 화요일

(130709) 12일차 ScriptEx.html, ScriptEx2.html (JavaScript 기본 설명 및 테스트)

 - 자바스크립트 언어 <script>
: 브라우저에서 무언가의 데이터를 제어하거나, 반복적으로 사용되어지거나, 하는 등의 브라우저의 언어를 제어하기 위한 것이다.
: HTML로 표현할 수 없는 여러가지 기능이 추가된 웹프로그래밍이다. 단 데이터베이스나 XML 연동은 되지 않는다.
: HTML을 조금더 프로그래밍적으로, 동적으로 만들어 주는 것이다.

 - 데이터 타입 (변수 하나에 모든 기본 데이터형 타입이 저장 된다 - 숫자, 논리값, 스트링, null 값)

 - 변수의 선언 
: 변수명 = 초기 값; (초기 값은 반드시 필요) - 전역변수
: var 변수명[=초기 값]; (초기 값은 옵션) - 지역변수


 - ScriptEx.html 소스 (지역변수, 전역변수, 메소드, 출력)
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<body>
<script type = "text/javascript">
money = 1000; // 전역변수

// function은 메소드
function test(){
var money = 2000; // var를 붙이면 지역변수
// 화면에 출력 - document는 <body>를 의미하므로 html 코드를 실행할 수 있다.
document.write(money + "<br>");
document.write(this.money + "<br>");
}

// 함수 호출 - test()를 쓰지 않으면 함수가 절대 호출되지 않는다.
test();

</script>
</body>
</html>


 - 결과






 - ScriptEx2.html 소스 (alert() 함수, confirm() 함수, prompt() 함수)
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<body>

<script type = "text/javascript">
var a = 10 - 5;

// alert() 함수 - 경고문이나 메시지를 전달하는 대화상자
alert("안녕하세요");
alert(a);

// confirm() 함수 - 둘 중 하나를 선택할때 사용. true나 false가 리턴된다.
a = confirm("10-5 = 5이면 확인 그렇지 않으면 취소를 눌러주세요");
if(a == true){
alert("5가 맞습니다.");
}
else{
alert("답이 아닙니다.");
}

// prompt() 함수 - 상호 대화형 대화 상자
var high = prompt("값을 넣어주세요", "0"); // 초기값 0
var b = parseInt(high)+10;
alert(b);
</script>
</body>

</html>


 - alert() 함수














 - confirm() 함수














 - prompt() 함수