국비학원 24일차) 자바스크립트

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
	<h1 id="test">This is a heading</h1>
	<script type="text/javascript">
	
	function func() {
		
		e=document.getElementById("test");
		e.style.color="red";
		
	}
	
	</script>
	<button type = "button" onclick="func()">클릭하세요</button>
	
	
	<script type="text/javascript">
	
	var msg="";
	var time = new Date().getHours();
	
	if(time<12) {
		msg="Good Morning";
	} else if(time<18) { //오후 6시 이전이면
		msg="Good Afternoon";
	} else {
		msg="Good evening";
		
	}
	alert(msg);
	
	</script>
	
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
	
	<script type="text/javascript">
	
	var grade = prompt("성적을 입력하세요:","A~F사이의 문자");
	
	switch(grade) {
	
	
	case 'A': alert("잘했어요");
	break;
	
	case 'B': alert("좋은 점수");
	break;
	
	case 'C': alert("괜찮은 점수");
	break;
	
	case 'D': alert("좀 더 노력");
	break;
	
	case 'F': alert("다음학기 수강");
	break;
	
	defult: alert("알 수 없는 학덤")
	
	}
	
	</script>
	
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
	
	<script type="text/javascript">
	
	for(i=0;i<10;i++) {
		document.write(i+"javaScript<hr>");
	}
	
	</script>
	
	<script type="text/javascript">
	
	document.write("<table border=1>");
	document.write("<tr>");
	for(i=0;i<10;i++) {
		document.write("<td>"+i+"</td>");
	}
	document.write("</tr>");
	document.write("</table>");
	
	</script>
	
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
	
	<script type="text/javascript">
	
	var i;
	var fruits=new Array();
	fruits[0]="Apple";
	fruits[1]="Banana";
	fruits[2]="Orange";
	
	for(i=0;i<fruits.length;i++)
		document.write(fruits[i]+"<br>");
	
	</script>
	
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>

<hr><a href="http://www.naver.com" onMouseOver="document.bgColor='red'; document.title='하하하'"
onMouseOut="document.bgColor='red'";
onClick="document.bgColor='green';"
> 마우스를 여기에 놓으면 어떤 색이 나옵니까? </a>

</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>

<script type="text/javascript">

function enter() {
	
	flag = confirm("성인사이트로 입장, 정말 입장하시겠습니까?");
	if(flag==false) { //취소버튼 눌렀을때 false
		return false;
	}
}

</script>

</head>
<body>
	
	<!-- onsubmit:submit버튼을 눌렀을 때 동작 
	onsubmit="return xxx()"는 자바스크립트 함수에서 return false를 했을 때 전송시키지 않기 위해 추가-->
	<form method="get" action="a.jsp" onsubmit="return enter()">
	
	<input type="button" value="그냥 버튼"><br>
	<!-- submit:form에서 지정한 action 경로로 data 전송 -->
	<input type="submit" value="전송 버튼"><br>
	
	
	</form>
	
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>

<script type="text/javascript">

function login() {
	
	var id=document.loginForm.userId;
	
	if(id.value=="") {
		alert("아이디를 입력하세요")
	} else {
		alert(id.value);
		id.value="";
	}
	id.focus();
}
</script>

</head>
<body>

<form name="loginForm">

아이디 <input type="text" name="userId">
<input type="button" value="로그인" onclick="login()">

</form>

</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>

<script type="text/javascript">
function checkTest() {
	
	var ag= document.checkForm.angel;
	var str="";
	
	for(i=0;i<ag.length;i++) {
		if(ag[i].checked) {
			str+=ag[i].value;
		}
	}
	
	if(str=="") {
		alert("당신은 이상형이 없습니다");
	} else {
		alert("당신의 아상형은"+str);
	}
	
}

</script>

</head>
<body>
	
	<form name="checkForm">
	이상형을 선택하세요<br>
	<input type="checkbox" name="angel" value="손연재">손연재<br>	
	<input type="checkbox" name="angel" value="크리스탈">크리스탈<br>	
	<input type="checkbox" name="angel" value="아이유">아이유<br>	
	<input type="button" value="확인" onclick="checkTest()">
	
	
	</form>
	
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>

<script type="text/javascript">

function selectCheck() {
	
	var s = document.subwayForm.line;
	if(s.value=="") {
		alert("호선을 선택하세요");
	} else {
		alert(s.value+"호선을 선택했습니다");
	}
	
}

</script>

</head>
<body>
	
	<form name="subwayForm">	
	<select name="line" onchange="selectCheck()">
	<option value="">----</option>
	<option value="1">1호선</option>
	<option value="2">2호선</option>
	<option value="3">3호선</option>
	<option value="4">4호선</option>
	</select>	
	
	<input type="button" value="선택" onclick="selectCheck()">
	
	</form>
	
	
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>

<script type="text/javascript">

function registerCheck() {
	
	var idTxt = document.regForm.userId;
	var passwordTxt = document.regForm.userPass;
	var passConfirmTxt = document.regForm.pass_confirm;
	var genderTxt=document.regForm.gender;
	var hobbyTxt=document.regForm.hobby;
	var locTxt=document.regForm.loc;
	
	if(idTxt.value=="") {
		alert("아이디 입력해주세요");
		return false;
	}
	
	if(idTxt.value.length>10 || idTxt.value.length<5) {
		alert("아이디 길이가 안맞아요");
		return false;
	}
	
	if(passwordTxt.value=="") {
		alert("패스워드 입력해주세요");
		return false;
	}
	
	if(passwordTxt.value!=passConfirmTxt.value) {
		alert("비밀번호 불일치");
		passwordTxt.value="";
		passConfirmTxt.value="";
		passwordTxt.focus();
		return false;
	}
	
	var flag=true;
	
	for(i=0;i<genderTxt.length;i++) {
		if(genderTxt[i].checked) {
			flag=false;
			break;
		}
	}
	
	if(flag) {
		alert("성별을 체크하세요")
	}
	
	var flag1=true;
	
	for(i=0;i<hobbyTxt.length;i++) {
		if(hobbyTxt[i].checked) {
			flag1=false;
			break;
		}
	}
	
	if(flag1) {
		alert("취미를 체크하세요")
	}
	
	if(locTxt.value=="") {
		alert("지역을 입력해주세요");
		return false;
	}
	
	
	
}

</script>

</head>
<body>
	
	<form name="regForm" method="post" onsubmit="return registerCheck()">
	
	<p>회원가입</p>
	아이디<input type="text" name="userId"> (5자 이상 10자 미만)<br>
	패스워드<input type="password" name="userPass"><br>
	패스워드확인<input type="password" name="pass_confirm"><br>
	
	성별 
	<input type="radio" name="gender" value="남">남자
	<input type="radio" name="gender" value="여">여자<br>
	취미
	<input type="checkbox" name="hobby" value="독서">독서
	<input type="checkbox" name="hobby" value="운동">운동
	<input type="checkbox" name="hobby" value="게임">게임<br>
	지역
	<select name="loc">
	<option value="">----
	<option value="서울">서울
	<option value="경기">경기
	<option value="부천">부천
	</select><br>
	
	<input type="submit" value="가입">
	
	</form>
	
</body>
</html>

728x90

'국비 학원 가서 개발새발' 카테고리의 다른 글

국비학원 26일차) JSP에서 서블릿으로 데이터를 가져오자(데이터 저장공간, 유효범위) (0)	2022.11.04
국비학원 25일차) JSP & 서블릿 (0)	2022.11.03
국비학원 23일차) html/css (0)	2022.11.02
국비학원 22일차) html 맛보기 (0)	2022.11.01
국비학원 21일차) 오늘도 JDBC를 했지만... (0)	2022.10.28

휴일이의 개발자국

국비학원 24일차) 자바스크립트

'국비 학원 가서 개발새발' 카테고리의 다른 글

티스토리툴바

국비학원 24일차) 자바스크립트

'국비 학원 가서 개발새발' 카테고리의 다른 글

관련글

티스토리툴바