Belajar HTML5 Elemen Time HTML5

  • Whatsapp
Belajar HTML5 Elemen Time HTML5

Labkom99.com – Elemen time HTML5 adalah elemen semantik yang digunakan untuk menentukan tanggal dan waktu halaman. Elemen time tersebut berisi 2 bagian informasi tanggal. Satu bagian untuk membaca mesin, bagian lainnya untuk bisa terbaca manusia. Berikut ini contoh sederhana kode elemen time.

<time datetime="2015-10-01">2015 years 10 month 1 day</time>   
 

Seperti pada kode contoh di atas, date dan time yang diberikan dalam atribut adalah untuk membaca mesin. Tanggal orang membaca adalah bagian <time> di antara tag.

Read More

Jika Anda hanya perlu menggunakan tanggal yang dapat dibaca oleh mesin, Anda dapat menulis tanggal di antara tag <time> alih-alih atribut date time, misalnya, seperti berikut ini:

<time>2015-10-01</time> 

Pada tahun 2011, elemen time tersebut dihapus dari spesifikasi HTML5. Tetapi setelah beberapa pembaruan nanti, itu baru ditambahkan ke spesifikasi HTML5.

 

Baca Juga : Belajar HTML5 Elemen Header Dan Footer HTML5

 

Format Tanggal

Format tanggal elemen time harus terdiri dari beberapa format yang tercantum di bawah ini:

YYYY-MM-DDTHH:MM:SS.SSS+ZHZM
YYYY-MM-DDTHH:MM:SS.SSS-ZHZM
YYYY-WXX

Arti format tanggal di atas adalah sebagai berikut:

Kode hurufdeskripsi
YYYYGunakan 4 digit untuk menentukan tahunnya, misalnya: 2015
MMGunakan 2 digit untuk menentukan bulan, contoh: 09 atau 12, bulan harus antara 01-12
WXXGunakan 2 digit untuk menentukan nomor minggu dalam setahun, seperti 01 atau 51. Jumlah minggu harus antara 01-53
DDGunakan 2 digit untuk menentukan jumlah hari, seperti 01 atau 31. Jumlah hari harus antara 01-31
THuruf T digunakan untuk menunjukkan bahwa string waktu dimasukkan setelah tanggal. Anda juga dapat menggunakan spasi sebagai pengganti huruf T.
HHGunakan 2 digit untuk menentukan jumlah jam, jumlah jam harus antara 00-23
MMGunakan 2 digit untuk menentukan jumlah menit, jumlah menit harus antara 00-59
SSGunakan 2 digit untuk menentukan jumlah detik, jumlah detik harus antara 00-59
SSSGunakan 3 digit untuk menentukan jumlah milidetik, jumlah milidetik harus antara 000-999
-ZHZMOffset zona waktu didasarkan pada UTC (Waktu Universal Terkoordinasi). Gunakan + atau-untuk menentukan, lalu gunakan 4-digit jam dan menit (HHMM) sebagai nilai offset.
+ ZHZMOffset zona waktu didasarkan pada UTC (Waktu Universal Terkoordinasi). Gunakan + atau-untuk menentukan, lalu gunakan 4-digit jam dan menit (HHMM) sebagai nilai offset.

Beberapa bagian dari opsi ini bersifat opsional. Misalnya, Anda tidak perlu menggunakan bagian waktu, detik dan mili detik juga opsional. Jika Anda menggunakan bagian waktu, Anda harus menentukan zona waktu.

Baca Juga : Belajar HTML5 Elemen Navigasi HTML5

Beberapa contoh format tanggal dan waktu tercantum di bawah ini:

Format tanggal dan waktucontoh
YYYY2015
TTTT-BB2015-09
TTTT-BB-HH2015-09-09
YYYY-WXX2015-W35
MM-DD09-10
YYYY-MM-DDTHJ: MM-ZHZM2015-09-10T23: 59-0500
TTTT-BB-HHTJJ: MM: SS-ZHZM2015-09-10T23: 59: 59-0500
YYYY-MM-DDTHJ: MM: SS.SSS + ZHZM2015-09-10T23: 59: 59: 999 + 0200
YYYY-MM-DDTHJ: MM: SS.SSS-ZHZM2015-09-10T23: 59: 59: 999-0500

Menentukan Durasi

Kita juga dapat menggunakan elemen time untuk menentukan durasi daripada waktu yang tepat. Untuk menentukan durasi, Anda dapat menggunakan prefiks time di atribut  data timedalam elemen P, lalu menambahkan satuan waktu setelahnya. Satuan waktu disini diwakili oleh 1 huruf, contoh:

<time datetime="P1D">    

 

Contoh di atas mewakili durasi satu hari.

Satuan durasi dapat berupa:

 

satuan

deskripsi

D

hari

H.

jam

M

menit

S

kedua

Anda tidak dapat menentukan bulan sebagai unit, karena jumlah hari dalam sebulan tidak tetap. Ini akan menghasilkan jumlah detik yang berbeda yang digunakan untuk menghitung waktu di tempat, jadi bulan tidak dapat digunakan.

Durasi di atas juga bisa ditulis dengan spasi di antara huruf untuk memudahkan membaca:

<time datetime="P 1 D"> 
 

Jika Anda P menggunakannya nanti T, Anda dapat menentukan durasi dengan lebih tepat:

<time datetime="PT12H 34M 59S">   

Contoh di atas menunjukkan bahwa durasinya adalah 12 jam, 34 menit dan 59 detik.

Perhatikan penggunaan spasi pada tulisan di atas. Anda juga bisa menulis durasinya seperti ini:

<time datetime="PT 12H 34M 59S">
<time datetime="PT12H34M59S">

Atribut Pubdate

elemen Time pubdate Atribut menunjukkan apakah kali ini adalah <article> waktu publikasi artikel .

Baca Juga : Belajar HTML5 Elemen Article Dan Elemen Aside HTML5

Berikut ini contohnya:

<time datetime="2015-09-10" pubdate>2015 years 9 month 10 day</time> 

Perhatikan bahwa Anda tidak perlu pubdate menentukan nilai true atau untuk atribut false. Penulisan seperti di atas berarti kali ini adalah waktu publikasi.

Berikut adalah contoh kode articleyang menggunakan elemen time dalam elemen :

<article>

<p>
Belajar HTML5 Elemen Time
</p>

<p>
<time datetime="2015-09-10" pubdate>2015 years 9 month 10 day</time>
</p>

</article>

Tidak ada aturan tegas tentang <time> apakah elemen di atas perlu disematkan ke dalam elemen p.

Related posts

Leave a Reply

Your email address will not be published. Required fields are marked *