1. 기본 문법(1)
페이지 정보
작성자 관리자 댓글 0건 조회 2,439회 작성일 22-01-07 16:33본문
1. 기본 문법(1)
1. alert() 함수 : 대화상자를 보여준다.
window.alert("메세지"); 또는 alert("메세지");
실습 : javascript01.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>자바스크립트 연습</title>
<script type="text/javascript">
window.alert("Hello world!!!");
</script>
</head>
<body>
</body>
</html>
2. 문자열 합치기 (+연산자)
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>자바스크립트 연습</title>
</head>
<body>
<script type="text/javascript">
<!--
var a, b;
a = '하이!! ';
b = "자바스크립트!!"
alert(a + b);
//-->
</script>
</body>
</html>
+연산자는 숫자일때는 숫자 더하기를 하고, 문자일 때는 붙여쓰기를 한다.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>자바스크립트 연습</title>
</head>
<body>
<script type="text/javascript">
<!--
var a, b;
a = 10;
b = 20;
alert(a + b);
//-->
</script>
</body>
</html>
3. 주석
//alert("Hello world!!!"); // 한줄 주석
/*여러문장을 주석처리 할때 많이 사용*/
실습 : javascript01.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>자바스크립트 연습</title>
</head>
<body>
<script type="text/javascript">
<!--
/* 여러줄 주석
var a, b;
a = 10;
b = 20;
alert(a + b);
*/
var aa;
aa = "http://www.naver.com";
alert(aa); // url을 대화상자에 보여준다.
// url로 연결한다.
location.href = aa;
//-->
</script>
</body>
</html>
대화상자에서 확인을 누르면, naver로 넘어간다.
4. write() 함수 - 내용을 해당 문서 내용에 보여준다.
document 객체의 write()함수이다.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>자바스크립트 연습</title>
</head>
<body>
<script type="text/javascript">
<!--
document.write("Hello JavaScript!!");
//-->
</script>
</body>
</html>
5. promt()함수 - 키보드로 입력받는다.
실습 : javascript02.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>자바스크립트 연습</title>
<script type="text/javascript">
var xx;
xx = window.prompt("당신의 이름을 입력하세요..!!");
// 입력한 이름을 해당 문서에 출력한다.
document.write("당신의 이름은 : "+xx+ " 입니다.<br/>");
</script>
</head>
<body>
</body>
</html>
다음과 같이 수정한다.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>자바스크립트 연습</title>
<script type="text/javascript">
var xx, age;
xx = window.prompt("당신의 이름을 입력하세요..!!");
document.write("당신의 이름은 : "+xx+ " 입니다.<br/>");
age = prompt("당신의 나이를 입력하세요");
document.write("당신의 나이는 : "+age+ "세 입니다. <br/><br/>");
</script>
</head>
<body>
</body>
</html>
이름과 나이를 입력받아 화면에 출력해준다.
6. 조건문(if)
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>자바스크립트 연습</title>
<script type="text/javascript">
var xx, age;
xx = window.prompt("당신의 이름을 입력하세요..!!");
document.write("당신의 이름은 : "+xx+ " 입니다.<br/>");
age = prompt("당신의 나이를 입력하세요");
document.write("당신의 나이는 : "+age+ "세 입니다. <br/><br/>");
//조건문
if(age > 18){
document.write("당신은 성인입니다...");
}else{
document.write("당신은 미성년자 입니다...");
}
</script>
</head>
<body>
</body>
</html>
실습 : javascript03.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>자바스크립트 연습</title>
<script type="text/javascript">
var juminNo = prompt("주민번호 형식: 800001-2111514","주민번호를 입력하세요");
var len = juminNo.length;
if(len != 14 || juminNo.charAt(6) != '-'){ //! --> not
alert("주민번호 형식이 잘못 되었습니다!!...");
}
var gender = juminNo.charAt(7);
var aa;
if(gender == '1'){
aa="남성";
}else if(gender =='2'){
aa="여성";
}else{
alert("주민번호를 다시 입력하세요!!!");
}
document.write("당신의 성별 :"+aa);
</script>
</head>
<body>
</body>
</html>
7. switch문
실습 : javascript03.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>자바스크립트 연습</title>
<script type="text/javascript">
var juminNo = prompt("주민번호 형식: 800001-2111514","주민번호를 입력하세요");
var len = juminNo.length;
if(len != 14 || juminNo.charAt(6) != '-'){ //! --> not
alert("주민번호 형식이 잘못 되었습니다!!...");
}
var gender = juminNo.charAt(7);
var aa;
switch(gender){
case '1':
aa="남성";
break;
case '2':
aa="여성";
break;
}
document.write("당신의 성별 :"+aa);
</script>
</head>
<body>
</body>
</html>
댓글목록
등록된 댓글이 없습니다.