--- id: 587d778c367417b2b2512aa9 title: 使用 HTML5 的 datetime 屬性標準化時間 challengeType: 0 videoUrl: 'https://scrimba.com/c/cmzMgtz' forumTopicId: 301025 dashedName: standardize-times-with-the-html5-datetime-attribute --- # --description-- 繼續日期主題。 HTML5 還引入了 `time` 標籤與 `datetime` 屬性來標準化時間。 `time` 元素是一個行內元素，用於在一個頁面上顯示日期或時間。 `datetime` 屬性包含的有效格式。 輔助設備可以獲取這個值。 這個屬性也有助於避免混亂，因爲它規定了時間的標準化版本，甚至可以在文本中以非正式的方式或學術方式使用它。 舉個例子： ```html

Master Camper Cat officiated the cage match between Goro and Scorpion , which ended in a draw.

``` # --instructions-- Camper Cat 格鬥的調查結果出來了！ 用 `time` 標籤包裹文本 `Thursday, September 15th`，添加一個 `datetime` 屬性，將屬性值設置爲 `2016-09-15`。 # --hints-- 應存在一個 `time` 元素和一個內容文本爲 `Thank you to everyone for responding to Master Camper Cat's survey.` 的 `p` 元素。 ```js assert(timeElement); ``` `time` 元素的內容文本應爲 `Thursday, September 15th`。 ```js assert( timeElement && timeElement?.innerHTML?.trim() === 'Thursday, September 15th' ); ``` `time` 元素應包含非空的 `datetime` 屬性。 ```js assert(datetimeAttr && datetimeAttr?.length); ``` `datetime` 的屬性值應爲 `2016-09-15`。 ```js assert(datetimeAttr === '2016-09-15'); ``` # --seed-- ## --after-user-code-- ```html ``` ## --seed-contents-- ```html

Tournaments

Mortal Kombat Tournament Survey Results

Thank you to everyone for responding to Master Camper Cat's survey. The best day to host the vaunted Mortal Kombat tournament is Thursday, September 15th. May the best ninja win!

Comments:

Posted by: Sub-Zero on

Johnny Cage better be there, I'll finish him!

Posted by: Doge on

Wow, much combat, so mortal.

Posted by: The Grim Reaper on

Looks like I'll be busy that day.

``` # --solutions-- ```html

Tournaments

Mortal Kombat Tournament Survey Results

Thank you to everyone for responding to Master Camper Cat's survey. The best day to host the vaunted Mortal Kombat tournament is . May the best ninja win!

Comments:

Posted by: Sub-Zero on

Johnny Cage better be there, I'll finish him!

Posted by: Doge on

Wow, much combat, so mortal.

Posted by: The Grim Reaper on

Looks like I'll be busy that day.

```