Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

แอตทริบิวต์ datetime ของ <time>: รูปแบบวันที่เวลาที่เครื่องอ่านได้

แอตทริบิวต์ datetime ของ <time> คืออะไร?

แอตทริบิวต์ datetime ของแท็ก <time> ใช้สำหรับ ระบุวันที่/เวลาในรูปแบบมาตรฐาน ISO 8601 (Machine-readable)** ที่เครื่องคอมพิวเตอร์ สูตรค้นหา และเครื่องมือช่วยเหลืออ่านได้

ไวยากรณ์ (Syntax)

<time datetime="YYYY-MM-DDThh:mm:ssTZD">ข้อความแสดงผล</time>

องค์ประกอบของ datetime

สัญลักษณ์ความหมายตัวอย่าง
YYYYปี (4 หลัก)2024
MMเดือน (01-12)06
DDวัน (01-31)15
Tตัวคั่นวันที่/เวลาT
hhชั่วโมง (00-23)09
mmนาที (00-59)30
ssวินาที (00-59)00
TZDTime Zone DesignatorZ (UTC), +07:00, -05:00

รูปแบบ Duration (ระยะเวลา) - ISO 8601 Duration

PnYnMnDTnHnMnS
P = Period (บอกว่าเป็นระยะเวลา)
Y = Years, M = Months, D = Days
T = Time section separator
H = Hours, M = Minutes, S = Seconds

ตัวอย่าง:
P3Y6M4DT12H30M5S = 3 ปี 6 เดือน 4 วัน 12 ชม. 30 นาที 5 วินาที
PT2H30M = 2 ชั่วโมง 30 นาที
P1W = 1 สัปดาห์

ตัวอย่างการใช้งาน

<!DOCTYPE html>
<html>
<body>
  <h2>ประกาศผลสอบ</h2>
  <p><s>ผลประกาศวัน 6 มิถุนายน</s></p>
  <p>วันที่ใหม่: วัน<time datetime="2024-06-15">เสาร์ที่ 15 มิถุนายน</time></p>
  <p>เวลา: <time datetime="09:00+07:00">09:00 น.</time></p>
  <p>ระยะเวลาสอบ: <time datetime="PT3H">3 ชั่วโมง</time></p>
</body>
</html>

จุดสำคัญ

  • เนื้อหาระหว่างแท็ก <time>...</time> = Human-readable (คนอ่าน)
  • datetime attribute = Machine-readable (เครื่องอ่าน)
  • ต้องเป็นรูปแบบ ISO 8601 เท่านั้น
  • ช่วย SEO (Rich Snippets), Calendar Import, Accessibility
  • ไม่แสดงผลบนหน้าจอโดยตรง ใช้ CSS จัดรูปแบบ