|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86 |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
var num1 = 10;
var num2 = 3;
//산술 연산자(+,-,*,/)
document.write(num1+"+"+num2+" = "+(num1+num2)+"<br/>");
document.write(num1+"-"+num2+" = "+(num1-num2)+"<br/>");
document.write(num1+"*"+num2+" = "+(num1*num2)+"<br/>");
document.write(num1+"/"+num2+" = "+(num1/num2)+"<br/>");
document.write("<hr/>");
//비교 연산자
document.write(num1+">"+num2+" = "+(num1>num2)+"<br/>");
document.write(num1+"<"+num2+" = "+(num1<num2)+"<br/>");
document.write(num1+">="+num2+" = "+(num1>=num2)+"<br/>");
document.write(num1+"<="+num2+" = "+(num1<=num2)+"<br/>");
document.write(num1+"!="+num2+" = "+(num1!=num2)+"<br/>");
document.write("<hr/>");
/*값이 같은가*/
document.write(num1+"=="+num2+" = "+(num1==num2)+"<br/>");
/*자료형까지 일치하는가*/
document.write(num1+"==="+num2+" = "+(num1===num2)+"<br/>");
num1=true;
num2=0;
/*내부적으로 숫자 0은 false*/
document.write(num1+"=="+num2+" = "+(num1 == num2)+"<br/>");
/*내부적으로 숫자 1은 true*/
num2=1;
document.write(num1+"=="+num2+" = "+(num1==num2)+"<br/>");
document.write(num1+"==="+num2+" = "+(num1===num2)+"<br/>");
document.write("<hr/>");
//논리 연산자
num1 = true;
num2 = false;
document.write(num1+"&&"+num2+" = "+(num1&&num2)+"<br/>");
document.write(num1+"&&"+num2+" = "+(num1&&num2)+"<br/>");
document.write(num1+"&&"+num2+" = "+(num1&&num2)+"<br/>");
document.write(num1+"&&"+num2+" = "+(num1&&num2)+"<br/>");
document.write("<hr/>");
document.write(num1+"||"+num2+" = "+(num1&&num2)+"<br/>");
document.write(num1+"||"+num2+" = "+(num1&&num2)+"<br/>");
document.write(num1+"||"+num2+" = "+(num1&&num2)+"<br/>");
document.write(num1+"||"+num2+" = "+(num1&&num2)+"<br/>");
document.write("<hr/>");
//증감 연산자
num1=10;
num2 = 10;
document.write("num1 = "+ ++num1 + "<br/>");
document.write("num2 = "+ num2++ + "<br/>");
document.write("num1 = "+ num2 + "<br/>");
document.write("num2 = "+ num2 + "<br/>");
document.write("<hr/>");
//삼항 연산자
//자바 스크립트는 자료형에 제약이 없으므로 자주 사용한다
//자바는 삼항연산자의 값 대입에서 서로 다른 타입의 값들을 배치하면 안되므로 if else를 더 많이 사용한다
num1=600;
num2=num1>500?num1*1.1:num1;
document.write("당신의 포인트 점수는 "+num2+"입니다");
document.write("<hr/>");
//8시간 까지는 7,530이다. 초과하면 1.5배이다.
var time=10;
var sal = 7530;
var pay = time > 8 ? (sal * 8)+(time-8)*(sal*1.5) : (sal * time);
document.write("당신의 임금은 "+pay+"입니다.");
</script>
</head>
<body>
</body>
</html> |
cs |
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29 |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>자바 스크립트 기본 문법</title>
<!--자바 스크립트는 head, body 어디에서나 사용 가능-->
<script type="text/javascript">
//화면에 출력하는 방법 (브라우저에 출력, html포함 가능)
document.write("<h1>Hello World</h1>")
//변수 : 프로그램에서 사용하기 위해 데이터를 저장하는 메모리 공간
//자바 스크립트에서는 자료형을 지정하지 않는다 , 변수 지정하지 않아도 사용가능하다
//변수 지정법 : var 변수 이름 = 데이터;
var name="최재원";
var age = 20;
var height = 180;
var gender ="남";
var payment = true;
var abc = 'a';
var ref = null;
result=height;
document.write("이름 : "+name+" ");//  스페이스바 효과
document.write("키 : "+result);
</script>
</head>
<body>
<h1 style="color:lime;">Hello World</h1>
</body>
</html> |
cs |
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34 |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>대화상자(입력값 받기, 경고메세지)</title>
<script type="text/javascript">
//대화상자
//경고 창(alert) 창 : alert("문자열"); //리턴을 받지 않음
//확인(confirm) 창 : confirm("문자열"); //리턴 있음(확인 =>true, 취소=>false);
//입력(prompt) 창 : prompt("문자열" , "초기 값"),prompt("문자열")
// 사용자가 입력한 문자열을 저장 할 수 있다.
//alert은 리턴 값이 없이 출력만 가능
//var res = alert("Hello \n hi"); \n줄 변경
//document.write("결과 : "+res); // undefined 정의되지 않았다
//confirm은 리턴이 있다. 확인 = true , 취소 = false
//var res = alert("Hello \n Hi");
//document.write("결과 : "+res);
//var res = confirm("80점 이상인가")?"합격":"불합격";
//document.write(res);
//prompt는 사용자가 입력한 내용을 받아서 기억 할 수 있다.
var res = prompt("숫자입력",10);
var result = (res%2==0)?"짝수":"홀수";
document.write("결과 : "+result);
</script>
</head>
<body>
</body>
</html> |
cs |
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60 |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>조건문 (if문, switch문)</title>
<script type="text/javascript">
/* var res = prompt("평균");
var pass;
if(res>=80){
pass = "합격";
} else{
pass = "불합격";
}
document.write(pass);
var res = prompt("평균");
var pass="불합격";
if(res>=80){
pass = "합격";
}
document.write(pass); */
/* 다중 if 90이상이면 A 80이상이면 B 70이상이면 C 나머지는 D */
/* var res = prompt("평균");
var result;
if(res>=90){
result="A";
}else if(res>=80){
result="B";
}else if(res>=70){
result="C";'
}else{
result="F";
}
document.write(result);*/
/*switch(숫자 , 문자 , 문자열) if처럼 boolean형 안된다, 범위 잡을 수 없다.*/
/* switch(key){
case 100:
result="A";
break;
default:
break;
} */
/*강제로 정수로 형 변환*/
switch(parseInt(res/10)){
case 10:
case 9: result="A";break;
case 8: result="B";break;
case 7: result="C";break;
default:result="F";break;
}
</script>
</head>
<body>
</body>
</html> |
cs |
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40 |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
/* var num = prompt("숫자");
for (var i = 1; i < 10; i++) {
document.write(num+"*"+i+"="+(num*i));
document.write("<br/>");
} */
/* for (var i = 2; i < 10; i++) {
for (var j = 1; j < 10; j++) {
document.write(i+" * "+j+"="+(i*j));
document.write("<br/>");
}
} */
/* for (var i = 2; i < 10; i++) {
for (var j = 1; j < 10; j++) {
document.write(i+" * "+j+"="+(i*j));
}
document.write("<br/>");
} */
for (var i = 1; i < 10; i++) {
for (var j = 2; j < 10; j++) {
document.write(i+" * "+j+"="+(i*j)+" "+" "+" ");
}
document.write("<br/>");
}
</script>
</head>
<body>
</body>
</html> |
cs |
자바스크립트 기초
'HTML│CSS│Java Script' 카테고리의 다른 글
| html 예제 (0) | 2017.12.05 |
|---|---|
| 자바 스크립트 배열 (0) | 2017.12.05 |
| html table / div / iframe 태그 작성하는 방법 (0) | 2017.12.04 |
| html ul 태그 li 태그 (0) | 2017.12.01 |
| Brackets IDE 설치 (0) | 2017.10.26 |
댓글