<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Count 만들기</title>
<!-- 더하기 누르면 +1, 빼기 누르면 -1 (최소는0, 최고는 100) -->
</head>
<body>
<button type="button" id="plus">더하기</button>
<button type="button" id="miu">빼기</button>
<button type="button" onclick="window.location.reload();">리셋</button>
<h1 id="print"></h1>
<script>
let num = 0;
let str = " ";
document.getElementById('plus').addEventListener('click',()=>{
if(num > 99){
alert(`최대수량입니다. 현재 수량: ${num}`);
} else {
num++;
str = `현재수량: ${num}`
}
document.getElementById('print').innerText=str;
})
document.getElementById('miu').addEventListener('click',()=>{
if(num < 1){
alert(`최소수량입니다. 현재 수량: ${num}`);
} else {
num--;
str = `현재수량: ${num}`;
}
document.getElementById('print').innerText=str;
})
</script>
</body>
</html>
'JS > JS 예시' 카테고리의 다른 글
[JS] class 예제 : 은행 (입금, 출금, 이체) (0) | 2023.04.18 |
---|---|
[JS] Map 예제 : 과목, 점수를 map에 저장하고 합계,평균 등 출력 (0) | 2023.04.18 |
[JS] 업다운 게임 (0) | 2023.04.17 |
[JS] 배수 출력 (1~100까지 중 입력한 숫자의 배수) (0) | 2023.04.17 |
[JS] 구구단 출력 (이중반복문 while) (0) | 2023.04.14 |