λμ μ€ν νμ : 0 ν
λμ μ€ν μκ° : 00:00:00
00:00:00
κΈ°μ΄μ μΈ μ€ν±μμΉ μμ€μμ μ΄ μ€ν νμμ μ΄ μ€ν μκ° κΈ°λ₯μ μΆκ°νλ€. μ΄κΈ°ν λ²νΌμ λλ₯Ό λλ§λ€ μ€ν νμμ μ΄ μ€ν μκ°μ΄ μ λ°μ΄νΈλλ λ°©μμΌλ‘ μ€κ³νλ€.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>
λμ μ€ν±μμΉ
</title>
</head>
<body>
<div style="margin: 100px">
<h1 id="cnt" >
λμ μ€ν νμ : 0 ν
</h1>
<h1 id="totalTime" >
λμ μ€ν μκ° : 00:00:00
</h1>
<h2 id="stopWatch" >
00:00:00
</h2>
<button id="startBtn" onclick="startBtnOnClick()">μμ</button>
<button id="stopBtn" onclick="stopBtnOnClick()">μΌμμ μ§</button>
<button id="resetBtn" onclick="resetBtnOnClick()">μ΄κΈ°ν</button>
</div>
<script src="app.js" type="text/javascript"></script>
</body>
</html>const stopWatch = document.getElementById("stopWatch");
const totalTimeText = document.getElementById("totalTime");
const cntText = document.getElementById("cnt");
let settingTime = 0; //κ²½κ³Ό μκ°
let cnt = 0; // λμ μ€ν νμ
let totTime = 0; // λμ μ€ν μκ°
let timerId, hour, min, sec; // μ¬κ·ν¨μ νΈμΆ λ³μ λ° μκ° μ€μ λ³μ
function printTime() {
settingTime++;
stopWatch.innerText = getTimeFormatString(settingTime);
}
//μμ - μ¬κ·νΈμΆλ‘ λ°λ³΅μ€ν
function startBtnOnClick() {
printTime();
stopBtnOnClick();
timerId = setTimeout(startBtnOnClick, 1000);
}
//μΌμμ μ§
function stopBtnOnClick() {
if (timerId != null) {
clearTimeout(timerId);
}
}
//μ΄κΈ°ν
function resetBtnOnClick() {
stopBtnOnClick()
totTime = totTime+settingTime;
if(stopWatch.innerText != "00:00:00"){
cnt++;
cntText.innerText = "λμ μ€ν νμ : "+cnt+"ν"
totalTimeText.innerText = "λμ μ€ν μκ° : "+getTimeFormatString(totTime);
}
stopWatch.innerText = "00:00:00";
settingTime = 0;
}
// μκ°(int)μ μ, λΆ, μ΄ λ¬Έμμ΄λ‘ λ³ν
function getTimeFormatString(time) {
hour = parseInt(String(time / (60 * 60)));
min = parseInt(String((time - (hour * 60 * 60)) / 60));
sec = time % 60;
return String(hour).padStart(2, '0') + ":" + String(min).padStart(2, '0') + ":" + String(sec).padStart(2, '0');
}
'κ°λ°μΌκΈ° π»' μΉ΄ν κ³ λ¦¬μ λ€λ₯Έ κΈ
| [JSP] JAVAλ‘ μ°μ²΄κ΅ Open API 볡νΈν/μνΈν νλ©΄ λμ°κΈ° (0) | 2023.11.30 |
|---|---|
| [Eclipse] νμ μ€νμ΄μ€λ‘ λ°κΎΈκΈ° (0) | 2023.11.16 |
| [SublimeText] λ¨μΆν€ μ 리 (1) | 2023.10.30 |
| [Eclipse]μ΄ν΄λ¦½μ€ ν λ§ Darkest Dark Theme μ μ© μ€λ₯ ν΄κ²° (0) | 2023.10.26 |
| [Oracle] ν μ΄λΈ 컬λΌμ 리μ€νΈλ‘ μΆμΆν΄ λμ μΈ κ·Έλ¦¬λ λ§λ€κΈ° (2) | 2023.10.24 |
