띠 구하기
웹/javascript2018. 1. 3. 01:17
<!DOCTYPE html>
<html lang="kr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>띠계산기</title>
<script>
var MySign = function(){
var birth_Y = document.getElementsByTagName("input")[0].value;
var SignArray = ["닭","개","돼지","쥐","소","범","토끼","용","뱀","말","양","원숭이"]
var remainder = birth_Y % 12;
alert.log("당신은 " + SignArray[remainder-1] + "띠 입니다.")
}
</script>
<style>
#box{margin:0 auto;width:300px;height:200px;}
#box input{width:100px;height:30px;font-size:16px;}
#box .text{font-size:18px;}
#box span{font-style:bold;color:#f00}
</style>
</head>
<body>
<div id="box">
<input type="text" value="1996" maxlength="4"/> <button class="btn" onclick="MySign()">입력</button>
<p class="text"></p>
</div>
</body>
</html>
이렇게 했다가 줄엿다...
if (birth_Y%12 == 1){
console.log("당신은 닭띠 입니다.")
}else if(birth_Y%12 == 2){
console.log("당신은 개띠 입니다.")
}else if(birth_Y%12 == 3){
console.log("당신은 돼지띠 입니다.")
}else if(birth_Y%12 == 4){
console.log("당신은 쥐띠 입니다.")
}else if(birth_Y%12 == 5){
console.log("당신은 소띠 입니다.")
}else if(birth_Y%12 == 6){
console.log("당신은 범띠 입니다.")
}else if(birth_Y%12 == 7){
console.log("당신은 토끼띠 입니다.")
}else if(birth_Y%12 == 8){
console.log("당신은 용띠 입니다.")
}else if(birth_Y%12 == 9){
console.log("당신은 뱀띠 입니다.")
}else if(birth_Y%12 == 10){
console.log("당신은 말띠 입니다.")
}else if(birth_Y%12 == 11){
console.log("당신은 양띠 입니다.")
}else if(birth_Y%12 == 0){
console.log("당신은 원숭이띠 입니다.")
최종
<!DOCTYPE html>
<html lang="kr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>띠계산기</title>
<script>
function MySign() {
var birth_Y = document.getElementsByTagName("input")[0].value;
if (birth_Y === "") {
return alert("숫자를 입력해주세요.");
}
var SignArray = [
"원숭이",
"닭",
"개",
"돼지",
"쥐",
"소",
"범",
"토끼",
"용",
"뱀",
"말",
"양"
];
var color = ["하얀", "검은", "파란", "붉은", "황금"];
var twelve = ["신", "유", "술", "해", "자", "축", "인", "묘", "진", "사", "오", "미"];
var stems = ["경", "신", "임", "계", "갑", "을", "병", "정", "무", "기"];
var remainder_a = birth_Y % 12;
var remainder_b = birth_Y % 10;
var colorNum = Math.floor(remainder_b / 2);
alert(
"당신은 " +
stems[remainder_b] +
twelve[remainder_a] +
"년에 태어났습니다." +
"\n" +
color[colorNum] +
SignArray[remainder_a] +
"띠"
);
}
</script>
<style>
#box{margin:0 auto;width:300px;height:200px;}
#box input{width:100px;height:30px;font-size:16px;}
#box .text{font-size:18px;}
#box span{font-style:bold;color:#f00}
</style>
</head>
<body>
<div id="box">
<input type="text" value="" minlength="4" maxlength="4" onkeypress="javascript:if(event.keyCode == 13){MySign()}"/> <button class="btn" onclick="MySign()">입력</button>
<p class="text"></p>
</div>
</body>
</html>
'웹 > javascript' 카테고리의 다른 글
| 모솔 몇일차인지 구하기.... (0) | 2018.01.03 |
|---|---|
| 노드를 클릭할때마다 클래스를 토글시키는법 (0) | 2017.12.11 |
| 2017.11.29 (0) | 2017.11.29 |
윈드리버(2016)
영화2017. 12. 24. 23:25
노드를 클릭할때마다 클래스를 토글시키는법
웹/javascript2017. 12. 11. 20:17
div.onclick = function(){
if ( this.getAttribute("class").indexOf("image-selected") == -1){
this.setAttribute("class","image image-selected")
}else{
this.removeAttribute("class","image image-selected")
}
// 위의 if문은 아래 .toggle() 로 줄일 수 있다
this.classList.toggle("image-selected")
}
'웹 > javascript' 카테고리의 다른 글
| 모솔 몇일차인지 구하기.... (0) | 2018.01.03 |
|---|---|
| 띠 구하기 (0) | 2018.01.03 |
| 2017.11.29 (0) | 2017.11.29 |
