/* 분:초를 출력하는 타이머를 만드는 코드를 콘솔창에 출력하도록 작성하세요.
- 00:00
*/
<body>
<button id="btn1" class="btn">버튼</button>
<script>
var second =0;
var minute = 0;
console.log(getTime(minute, second));
setInterval(function(){
second++;
minute= second ==60? ++minute : minute;
second= second ==60? 0 : second;
console.log(getTime(minute,second));
},1000);
function addZero(num){
return num<10? '0'+num : num;
}
function getTime(minute, second){
return addZero(minute)+':' +addZero(second);
}
</script>
</body>
/*
- 시작버튼과 종료버튼을 만들어서, 시작버튼을 누르면 타이머가 시작되고
종료버튼을 누르면 타이머가 종료되도록 코드를 작성하세요.
단, 타이머는 콘솔에 출력
*/
<body>
<button id="start" class="btn">시작</button>
<button id="end" class="btn">종료</button>
<script>
var second =0;
var minute = 0;
console.log(getTime(minute, second));
var startBtn = document.querySelectorAll('#start');
var id;
startBtn[0].addEventListener('click',function(){ //All은 여러개일수있음=> 배열로저장
id = setInterval(function(){ //타이머 시작 코드
second++;
minute= second ==60? ++minute : minute;
second= second ==60? 0 : second;
console.log(getTime(minute,second));
},1000);
})
var endBtn=document.querySelectorAll('#end');
endBtn[0].addEventListener('click', function(){
clearInterval(id);
})
function addZero(num){
return num<10? '0'+num : num;
}
function getTime(minute, second){
return addZero(minute)+':' +addZero(second);
}
</script>
</body>
'괴발개발 > Javascript+JQuery' 카테고리의 다른 글
JS_history객체 (0) | 2021.06.21 |
---|---|
JS_document객체 (0) | 2021.06.21 |
JS_요소선택 (0) | 2021.06.21 |
JS_이벤트(event) (0) | 2021.06.21 |
JS_정규표현식 (0) | 2021.06.21 |