Membuat Dan Menampilkan Waktu Aktif Dan Tanggal Update Dengan Javascript

ِبِسْمِ الله الرَّحْمَنِ الرَّحِيْم

mulailah membaca artikelnya dengan membaca bismillah, semoga kita mendapatkan manfaat dari blog ini aamiin.

|

Membuat Dan Menampilkan Waktu Aktif Dan Tanggal Update Dengan Javascript

Membuat dan Menampilkan Waktu Tanggal dengan Javascript – Source Code di bawah ini merupakan dasar untuk membuat Time dari Milidetik, detik, menit, jam dan juga untuk membuat Tanggal dari Hari, Tanggal, bulan dan tahun. Simak sebagai berikut:

Millisecond
Hasilnya 0-999

Millisecond = new Date().getMilliseconds();

Output <script>document.write(new Date().getMilliseconds());</script>

Detik
Hasilnya 0-59
Detik = new Date().getSeconds();

Output <script>document.write(new Date().getSeconds());</script>

Menit
Hasilnya 0-59
Menit = new Date().getMinutes();

Output <script>document.write(new Date().getMinutes());</script>

Jam
Hasilnya 0-23
Jam = new Date().getHours();

Output <script>document.write(new Date().getHours());</script>

Hari
Hasilnya 0-6
Hari Minggu dimulai dari angka 0
Hari = new Date().getDay();

Output <script>document.write(new Date().getDay());</script>

Tanggal
Hasilnya 0-30
Tanggal = new Date().getDate();

Output <script>document.write(new Date().getDate());</script>

Bulan
Hasilnya 0-11
Bulan = new Date().getMonth();

Output <script>document.write(new Date().getMonth());</script>

Tahun
Hasilnya Tahun saat ini
Tahun = new Date().getFullYear();

Output <script>document.write(new Date().getFullYear());</script>

Waktu (Time) Dan Tanggal (Date)

attrbulan = ["Januari","Februari","Maret","April","Mei","Juni","Juli","Agustus","September","Oktober","November","Desember"];
date = new Date();
millisecond = date.getMilliseconds();
detik = date.getSeconds();
menit = date.getMinutes();
jam = date.getHours();
hari = date.getDay();
tanggal = date.getDate();
bulan = date.getMonth();
tahun = date.getFullYear();
document.write(tanggal+"-"+attrbulan[bulan]+"-"+tahun+"
"+jam+" : "+menit+" : "+detik+"."+millisecond);

Output

<script>attrbulan = ["Januari","Februari","Maret","April","Mei","Juni","Juli","Agustus","September","Oktober","November","Desember"];
date = new Date();
millisecond = date.getMilliseconds();
detik = date.getSeconds();
menit = date.getMinutes();
jam = date.getHours();
hari = date.getDay();
tanggal = date.getDate();
bulan = date.getMonth();
tahun = date.getFullYear();
document.write("Tanggal="+tanggal+"-"+attrbulan[bulan]+"-"+tahun+" "+ "Jam="+jam+" : "+menit+" : "+detik+":"+millisecond);</script>

Waktu dan Tanggal Update = new Date();

Output <script>document.write(new Date());</script>

Javascript Untuk Menampikan Waktu (Aktif) dan Tanggal

Menampikan Waktu (Aktif)

<script type="text/javascript"></script>
// 1 detik = 1000
window.setTimeout("waktu()",1000);  
function waktu() {   
var tanggal = new Date();  
setTimeout("waktu()",1000);  
document.getElementById("jam").innerHTML = tanggal.getHours()+":"+tanggal.getMinutes()+":"+tanggal.getSeconds();
}
</script>
<div id="jam"></div>

Output

<script type="text/javascript">
// 1 detik = 1000
window.setTimeout("waktu()",1000);  
function waktu() {   
var tanggal = new Date();  
setTimeout("waktu()",1000);  
document.getElementById("jam").innerHTML = tanggal.getHours()+":"+tanggal.getMinutes()+":"+tanggal.getSeconds();
}
</script>
<div id="jam"></div>

<div id="Time"></div>
<script>
function showTime() {
    var a_p = "";
    var today = new Date();
    var curr_hour = today.getHours();
    var curr_minute = today.getMinutes();
    var curr_second = today.getSeconds();
    if (curr_hour < 12) {
        a_p = "AM";
    } else {
        a_p = "PM";
    }
    if (curr_hour == 0) {
        curr_hour = 12;
    }
    if (curr_hour > 12) {
        curr_hour = curr_hour - 12;
    }
    curr_hour = checkTime(curr_hour);
    curr_minute = checkTime(curr_minute);
    curr_second = checkTime(curr_second);
 document.getElementById('Time').innerHTML=curr_hour + ":" + curr_minute + ":" + curr_second + " " + a_p;
    }

function checkTime(i) {
    if (i < 10) {
        i = "0" + i;
    }
    return i;
}
setInterval(showTime, 500);
</script>

Output

<div id="Time"></div>
<script>
function showTime() {
    var a_p = "";
    var today = new Date();
    var curr_hour = today.getHours();
    var curr_minute = today.getMinutes();
    var curr_second = today.getSeconds();
    if (curr_hour < 12) {
        a_p = "AM";
    } else {
        a_p = "PM";
    }
    if (curr_hour == 0) {
        curr_hour = 12;
    }
    if (curr_hour > 12) {
        curr_hour = curr_hour - 12;
    }
    curr_hour = checkTime(curr_hour);
    curr_minute = checkTime(curr_minute);
    curr_second = checkTime(curr_second);
 document.getElementById('Time').innerHTML=curr_hour + ":" + curr_minute + ":" + curr_second + " " + a_p;
    }

function checkTime(i) {
    if (i < 10) {
        i = "0" + i;
    }
    return i;
}
setInterval(showTime, 500);
</script>

Menampikan Tanggal

<script>
var tanggallengkap = new String();
var namahari = ("Minggu Senin Selasa Rabu Kamis Jumat Sabtu");
namahari = namahari.split(" ");
var namabulan = ("Januari Februari Maret April Mei Juni Juli Agustus September Oktober November Desember");
namabulan = namabulan.split(" ");
var tgl = new Date();
var hari = tgl.getDay();
var tanggal = tgl.getDate();
var bulan = tgl.getMonth();
var tahun = tgl.getFullYear();
tanggallengkap = namahari[hari] + ", " +tanggal + " " + namabulan[bulan] + " " + tahun;
document.write(tanggallengkap);
</script>

Output

<script>
var tanggallengkap = new String();
var namahari = ("Minggu Senin Selasa Rabu Kamis Jumat Sabtu");
namahari = namahari.split(" ");
var namabulan = ("Januari Februari Maret April Mei Juni Juli Agustus September Oktober November Desember");
namabulan = namabulan.split(" ");
var tgl = new Date();
var hari = tgl.getDay();
var tanggal = tgl.getDate();
var bulan = tgl.getMonth();
var tahun = tgl.getFullYear();
tanggallengkap = namahari[hari] + ", " +tanggal + " " + namabulan[bulan] + " " + tahun;
document.write(tanggallengkap);
</script>

<div id="date"></div>
<script type='text/javascript'>
 var months = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];
 var myDays = ['Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jum&#39;at', 'Sabtu'];
 var date = new Date();
 var day = date.getDate();
 var month = date.getMonth();
 var thisDay = date.getDay(),
     thisDay = myDays[thisDay];
 var yy = date.getYear();
 var year = (yy < 1000) ? yy + 1900 : yy;
 document.getElementById('Time').innerHTML=thisDay + ', ' + day + ' ' + months[month] + ' ' + year;
</script>

Output

<div id="date"></div>
<script type='text/javascript'>
 var months = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];
 var myDays = ['Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jum&#39;at', 'Sabtu'];
 var date = new Date();
 var day = date.getDate();
 var month = date.getMonth();
 var thisDay = date.getDay(),
     thisDay = myDays[thisDay];
 var yy = date.getYear();
 var year = (yy < 1000) ? yy + 1900 : yy;
 document.getElementById('Time').innerHTML=thisDay + ', ' + day + ' ' + months[month] + ' ' + year;
</script>

Github Javascript untuk Menentukan Waktu dan Tanggal

https://github.com/ikhwanfillah-sc/Time-and-Date

Baca juga : CARA MIGRASI WEBSITE TANPA DOWNTIME DAN PROPAGASI