如何使用HTML5的<time>显示时间信息

HTML5的<time>标签是用来表示日期和时间的元素，在显示时间信息时具有一定的语义化。下面将介绍如何使用<time>标签来显示时间信息，并提供相应的函数和代码案例。


1. HTML5的<time>标签

HTML5的<time>标签可以用来表示日期、时间或日期时间的内容，它具有以下属性：

  • datetime: 指定日期和时间的值，必须遵循指定格式，例如YYYY-MM-DD或YYYY-MM-DDThh:mm:ss。
  • pubdate: 表示该时间是文章发布的时间，可以用在文章的<time>标签上。

2. 使用<time>标签显示时间信息

使用<time>标签来显示时间信息非常简单，只需按照以下步骤操作：

  1. 在需要显示时间的地方插入<time>标签。
  2. 使用datetime属性指定日期和时间的值。
  3. 在<time>标签内部输入要显示的时间信息。
<time datetime="2022-01-01">2022年1月1日</time>

以上代码将在页面上显示。

3. JavaScript函数显示时间信息

如果需要动态显示当前时间，可以使用JavaScript函数来实现。下面是一个简单的示例：

function showTime() { var now = new Date(); var year = now.getFullYear(); var month = now.getMonth() + 1; var day = now.getDate(); var time = year + '年' + month + '月' + day + '日'; document.getElementById('time').innerHTML = time; } setInterval(showTime, 1000);

以上代码将每秒更新一次页面上的时间信息。

通过以上步骤，你已经学会如何使用HTML5的

本文为翻滚的胖子原创文章,转载无需和我联系,但请注明来自猿教程iskeys.com

猿教程
请先登录后发表评论
  • 最新评论
  • 总共0条评论