JSP || DAY2 || 반복문, 함수
0. 반복문
var 변수 = 초기값; var i = 0;
while(조건식) { while(i<5){
실행문; document.write("Hello World");
증감식; i++;
} }
<!-- #문제
:while반복문을 이용하여 1~30 의 숫자 중에서
2의 배수이고 6의 배수인 숫자만 반복해서 출력하기
-->
var i = 1;
while (i<=30){
if (i%2 ==0 && i%6 ==0) {
document.write(i);
}
i++;
}
<!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=UTF-8">
<title>Insert title here</title>
<!-- 예제 : 함수를 만들어 놓고
[배경색 바꾸기] 버튼을 클릭할 때마다 만들어 놓은 함수를 호출해서
<body>태그영역의 배경색이 바뀌도록 만들기.
-->
<script type="text/javascript">
//배열만들기
var color=["black","yellow", "aqua", "purple"];
var i = 0; //위 color배열메모리의 각 index위치번호를 저장시킬 변수.
// 함수의 기능 :
// 1. i변수에 저장된 값을 1증가.
// 2. 바디태그의 배경색을 위 color배열에 저장된 값으로 설정하기
function colorBg(){
//body태그를 선택해서 가져오는 구문 -> document.getElementsByTagName("태그명");
var myBody = document.getElementsByTagName("body")[0];
//body태그 영역에 배경색을 color배열의 각index위치에 있는 색상값으로 저장
myBody.style.backgroundColor = color[i];
i++;
}
</script>
</head>
<body>
<!-- 사이트 방문자가 행하는 모든 행위, 동작=> event라고 부름
아래의 button태그에 사이트 방문자가 클릭하는 행위, 동작을 등록함
등록하는 방법 -> onclick속성을 이용하여 등록한다.
-->
<button onclick="colorBg();">배경색 바꾸기</button>
</body>
</html>1. 함수
# 익명함수
var theFunc = function(){
i++;
document.write("bye" + i, "<br>")
}
# 매개변수
//myFunc이름의 변수만들기. 이 함수는 매개변수 name, area를 가짐.
//매개변수는 해당 함수의 실행문에서 활용된다.
function myFunc(name, area) {
document.write("안녕하세요 저는 "+ name + "입니다. <br>");
document.write("사는 곳은 " + area + "입니다. <br><br>";
}
//생성한 함수 사용하기
myFunc("홍길동", "한국");# 예제 - 로그인정보 받기
-> 질의응답창을 사용하여, 사이트 방문자에게 아이디와 비밀번호를 입력받고
1) 만일 잘못된 아이디가 입력된 경우에는, "존재하지 않는 아이디 입니다. " 경고창 띄우기.
2) 만일 잘못된 비밀번호가 입력된 경우에는 , "잘못된 비밀번호 입니다." 경고창 띄우기.
3) 아이디, 비밀번호가 모두 올바르게 일치할 경으, 환영문구를 출력하라.
( DB에 저장된 데이터 아이디="coder" , 비밀번호="0000"라고 가정함. )
<head>
<script type="text/javascript">
// 입력받은 아이디, 비밀번호가 올바른지 유효성 체크하기.
function login(id,pw){
if (id == "coder") {
if (pw == "0000") {
document.write("USER: "+id+", "+" == SUCCESSFULLY LOGGED IN! == ");
}
else {
alert("잘못된 비밀번호 입니다.");
}
}
else{
alert("존재하지 않는 아이디 입니다.");
}
}
// 질의응답창을 띄워 사이트 방문자에게 아이디, 비밀번호를 입력받기.
var user_id = prompt("id를 입력하세요. => ","");
var user_pw = prompt("pw를 입력하세요. => ","");
// 함수호출
login(user_id, user_pw);
</script>
</head>
<body>
</body>
</html>'개발자 양성과정 필기노트 > JavaScript' 카테고리의 다른 글
| 브라우저객체모델 BOM (0) | 2021.08.04 |
|---|---|
| Math메서드, 배열메서드 (0) | 2021.08.03 |
| 재귀함수, 내장객체 (0) | 2021.08.02 |
| 조건문 (0) | 2021.07.29 |
| 증감연산자 (0) | 2021.07.27 |
댓글