Anlık Güncel Tarih ve Saat Gösterimi

Javascript ile sitenize ekleyebileceğiniz anlık, güncel ve her saniye yenilenen tarih ve saat gösteriminden bahsettim. Örnek kullanımı incelemek için yazımın devamını okuyabilirsiniz.

Merhabalar,

Bu yazımda sitenizde anlık, güncel ve her saniye yenilenen tarih ve saat gösteriminden bahsedeceğim. Bu işlemi Javascript ile yaparak örneklendireceğim. Admin, müşteri panellerine veya header bölümüne ekleyebilirsiniz.

Hemen nasıl yapacağımıza bakalım;

<div id="zaman"></div>
<script>
function tarihSaat() {
    var date = new Date().toLocaleString('tr-TR'); // tarih saati al
    document.getElementById("zaman").innerHTML = date; // zaman id'li elemente yazdır
}
</script> 

Yukarıdaki kod parçacığı anlık tarih ve saati zaman id’li Html elementine yazdıracaktır. Tabii sadece yazdırma anlık olarak basıp oraya sabit tarih ve saati gömecektir. Bunu her 1 saniye içinde yenilersek, saniyeler arttıkça saatin ve tarihin gerekli zaman dilimlerinde güncellendiğini görebiliriz. Bu sayede sayfayı yenilememiz gerekmeden, her 1 saniyede tarihSaat fonksiyonunu yeniden çalıştırabiliriz.

Bu işlem için setInterval kullanacağım;

<div id="zaman"></div>
<script>
function tarihSaat() {
    var date = new Date().toLocaleString('tr-TR');
    document.getElementById("zaman").innerHTML = date;
}
// her 1 saniyede tarihSaat fonksiyonunu yeniden çalıştır
setInterval(tarihSaat, 1000); 
</script> 

İşlemimiz bu kadar. Her 1 saniyede güncellendiği için anlık saati ve tarihi otomatik olarak yazdıracaktır.

Kullanışlı bir özellik olduğunu düşünüyorum. İşinize yarayacak kısa bir işlemdir.

Mutlu Kodlamalar 🙂

11 Shares:
2 comments

Benimle yorumunu paylaş;

Bunlara da göz atabilirsin
Ülke Telefon Kodu Listeleme
Devamını Oku

Ülke Telefon Kodu Listeleme

Telefon numarası alanına ülkelerin telefon kodlarını listeleyip seçilen ülkenin telefon kodunu otomatik ekleten bir Javascript eklentisinden bahsettim. Yazımın devamını okuyup detaylı inceleyebilirsiniz.

Devamını Oku

Javascript Metni Kopyala Butonu
Devamını Oku

Input Metni Kopyala Butonu

Bu yazımda Javascript ile input, textarea gibi form elemanları içindeki veriyi kopyalayan bir buton yapımı örneğinden bahsettim. Detaylar için yazımı kontrol edebilirsiniz.

Devamını Oku