Tutorial Menampilkan Tanggal dan Waktu Sekarang dengan JavaScript

Selain di PHP, dengan javascript kita juga bisa menampilkan tanggal. kita dapat menampilkan tanggal dengan berbagai format. bisa itu menampilkan hari, menit, detik, bulan, tahun dan lainnya.

Sebenarnya pada PHP kita juga dapat menampilkan tanggal dan waktu secara  up to date,namun pada PHP kita tidak bisa menjadikan waktu tersebut terlihat  hidup,namun dengan javascript kita bisa menjadikan waktu  tersebut terlihat dinamis.  

Ada sebuah fungsi yang khusus di sediakan di javascript untuk menampilkan tanggal. yaitu kita bisa menggunakan fungsi Date(). dengan menggunakan fungsi Date() ini kita bisa menampilkan tanggal di php. dan untuk mengatur format tanggal yang di tampilkan, teman-teman bisa menyesuaikannya dengan memberikan/mengisi format  tanggal nya sesuai dengan keinginan di dalam parameter.

fungsi Date().

Perlu teman-teman perhatikan. seperti yang sudah kita bahas pada tutorial javasript dasar sebelumnya, bahwa javascript memiliki sifat case sensitive, yang artinya penulisan javascript sangat berpengaruh sekali tentang besar kecil huruf nya. jadi untuk membuat tanggal, teman-teman harus menuliskan fungsi date nya dengan benar. maksud nya huruf D nya besar.

Contoh salah

date()

Contoh benar

Date()

 

Tanggal (Date)

Tanggal yang dalam bahasa inggrisnya date, menampilkan tanggal dan bulan.

JS

    

untuk mengambil tanggal konsepnya juga sama dengan mengambil waktu, pertama dilakukan inisialaisasi selanjutnya mengambil data tanggal dan bulan ke mesin (sistem komputer). lalu di buat dalam variabel id="date".

Contoh full source codenya

    

perbedaannya pada time adalah cara pemanggilan id nya, untuk mengambil date letakkan scriptnya di bawah id pemanggilan.

Jika di jalankan maka akan muncul waktu up to date  atau waktu pada saat ini

                                               

 

Setelah kita berhasil menampilkan tanggal selanjutnya  kita akan mencoba menampilkan waktu

 

Waktu (Time)

Waktu yang dalam bahasa inggrisnya time, menampilkan jam, menit dan detik.

JS

    

source code di atas merupakan code untuk menampilkan waktu yang di ambil dari mesin (sistem komputer).  pertama di inisialaisasi terlebih dahulu jam, tanggal dan waktu. lalu di berikan pengandaian jika jam yang di ambil dari sistem kurang dari 12 maka akan diberikan "AM" di belakangnya dan sebaliknya jika tidak akan di tambah "PM" di belakangnya. Selanjutnya karena yang akan ditampilkan adalah format AM dan PM, maka hanya menampilkan format 12 jam. Lalu selanjutnya agar dapat di tampilkan di HTML maka di buat dengan variabel id 'item' . Yang mana variabel id item tersebut untuk menampilkan jam, menit dan detik. itu penjelasan sedikit tentang source codenya.

Contoh full source codenya

    

jadi untuk menampilkan jam, di buat terlebih dahulu struktur HTML nya lalu letak script tadi di bagian head. dan untuk memanggil script yang telah di buat gunakan div dengan id="time" 

Jika kita jalankan hasilnya maka akan seperti berikut

                                                   

jika ingin lebih menarik bisa di tambahkan CSS sendiri.  Karena gambar format png jadi detiknya tidak bergerak.

Oke teman-teman sekian dulu tutorial Belajar javascript tentang Menampilkan tanggal dan waktu sekarang dengan javascript.Semoga bermanfaat