Menu
Coddy logo textTech

Çalışan Kronometre

Coddy'nin Kronometre - HTML/CSS/JS Projesi kursunda ders 9 / 10.

Artık çalışan başlat ve durdur düğmelerine sahip olduğumuza göre, saymaya başlamanın zamanı geldi!

Saymak için setInterval adında bir JavaScript fonksiyonu kullanacağız:

const interval = setInterval(func, milliseconds)

Fonksiyon iki argüman alır: bir fonksiyon ve milisaniyeyi temsil eden bir sayı. Fonksiyon, sağlanan her milisaniye miktarında bir çağrılır.

Örneğin:

let count = 0

function updateCount() {
	count += 1;
}

const interval = setInterval(updateCount, 1000)

Yukarıdaki örnekte, count değişkenini her saniye 1 artırıyoruz.

Bir interval'i durdurmak isterseniz, setInterval'ın dönüş değeriyle birlikte clearInterval kullanın:

const interval = setInterval(updateCount, 1000)
clearInterval(interval)
challenge icon

Görev

Orta

JS dosyanıza aşağıdaki desteği ekleyin:

  • Başlat/durdur (start/stop) düğmesine tıklandığında, kronometre metnini her saniye bir artıracak şekilde güncelleyen bir aralık (interval) ayarlayın, doğru formatlandığından emin olun.
  • Başlat/durdur düğmesine tekrar tıklandığında, çalışan aralığı (interval) temizleyin.

Kodunuza bir setInterval eklediğinizde, web görünümündeki sıfırlama (reset) düğmesine tıklamanız gerekecektir:

reset button

Kendin dene

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Write HTML code here -->
        <script src="script.js"></script>
    </body>
</html>

Kronometre - HTML/CSS/JS Projesi bölümündeki tüm dersler

4JS Bölümü

Temel Başlat ve DurdurProje dersiÇalışan KronometreProje dersiSıfırlamaProje dersi

3CSS Bölümü

BodyProje dersiZamanProje dersiButonlarProje dersi