HTML网络编程之时间格式

络编程之时间格式。

同学们好，今天我们分享的是如何让搜索引擎等程序更容易地提取网页中的时间信息。我们将使用time标签来实现这一目标。这个标签你们可能已经有所了解，但是现在不需要掌握太多细节，只需要知道它的作用即可。

现在来看看我们的示例页面，可以看到页面中包含了很多句不同时间格式的文字。这些文字并没有什么特别之处，只是每一句都包含着时间信息。时间信息的格式比较复杂，但是这不影响我们的演示效果。

接下来，我们将介绍实现代码。time标签用于定义公历日期或时间、二十四小时制，时间和时区偏移是可选的。在所有浏览器中，time标签不会渲染任何特殊的效果。但是，它可以让搜索引擎更容易地在网页中找到对应的时间信息。

使用time标签的另一个原因是，世界上有许多不同的日期格式，但是这些不同的格式不容易被电脑识别。如果我们想自动抓取页面上所有事件的日期并将它们插入到日历中，time元素可以让我们附上清晰的可被机器识别的时间或日期。因此，time标签并不是为了给用户看的，而是为了方便搜索引擎更好地在网页上找到对应的时间。

在我们的示例中，时间和普通文字看上去没有任何区别。除了搜索引擎，网页同手机上的日历、提醒等应用程序交互时，time标签也可以提供很大的方便。

time标签非常简单，只包含一个属性datatime，用于规定日期和时间。如果需要，我们还可以通过元素的内容来指定日期和时间。time标签的值有很多种，只要是符合规范的时间写法格式，都可以被接受并转化为第三方使用的格式。

总之，time标签的使用频率并不高，不需要我们进行太多的学习和理解。如果你们知道有这个东西并且知道它的大概意思，就可以了。

今天的分享就到这里，所有的案例和相关文档都可以向我索取。

下期见，想学习编程的同学请关注我。

期获取方法

获取方法用于获取日期的某个部分（来自日期对象的信息）。下面是最常用的方法（以字母顺序排序）：

getTime() 方法

getTime() 方法返回自 1970 年 1 月 1 日以来的毫秒数：

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript getTime()</h2>
<p>JavaScript 中的内部时钟从 1970 年 1 月 1 日午夜开始计算。</p>
<p>getTime() 函数返回从那时起的毫秒数：</p>
<p id="demo"></p>
<script>
var d = new Date();
document.getElementById("demo").innerHTML = d.getTime();
</script>
</body>
</html>

getFullYear() 方法

getFullYear() 方法以四位数字形式返回日期年份

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript getFullYear()</h2>
<p>getFullYear() 方法返回日期的完整年：</p>
<p id="demo"></p>
<script>
var d = new Date();
document.getElementById("demo").innerHTML = d.getFullYear();
</script>
</body>
</html>

getMonth() 方法

getMonth() 以数字（0-11）返回日期的月份：

在 JavaScript 中，第一个月（1 月）是月号 0，因此 12 月返回月号 11。

您可以使用名称数组，并使用 getMonth() 将月份作为名称返回：

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript getMonth()</h2>
<p>getMonth（）方法以 0 到 11 之间的数字返回日期的月份。</p>
<p>要获得正确的月份，您必须添加 1：</p>
<p id="demo"></p>
<script>
var d = new Date();
document.getElementById("demo").innerHTML = d.getMonth() + 1;
</script>
</body>
</html>

getDate() 方法

getDate() 方法以数字（1-31）返回日期的日：

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript getDate()</h2>
<p>getDate() 方法以数字（1-31）返回日期的日：</p>
<p id="demo"></p>
<script>
var d = new Date();
document.getElementById("demo").innerHTML = d.getDate();
</script>
</body>
</html>

getHours() 方法

getHours() 方法以数字（0-23）返回日期的小时数：

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript getHours()</h2>
<p>getHours() 方法以数字（0-23）返回日期的小时：</p>
<p id="demo"></p>
<script>
var d = new Date();
document.getElementById("demo").innerHTML = d.getHours();
</script>
</body>
</html>

getDay() 方法

getDay() 方法以数字（0-6）返回日期的星期名（weekday）：

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript getDay()</h2>
<p>getDay() 方法将周名作为数字返回：</p>
<p id="demo"></p>
<script>
var d = new Date();
document.getElementById("demo").innerHTML = d.getDay();
</script>
</body>
</html>

在 JavaScript 中，一周的第一天（0）表示“星期日”，即使世界上的一些国家认为周的第一天是“星期一”。

您可以使用名称数组，并使用 getDay() 将星期名作为名称返回：

niapp中的日历组件需要用到开始时间和结束时间，这个时间是字符串形式的，如'2021-01-21'。

组件网址：https://ext.dcloud.net.cn/plugin?id=56

需求

我的需求是得到7天前到现在日期的字符串形式，即

startDate: '2021-11-04'',
endDate: '2021-11-11',

上代码：

Date.prototype.format = function(fmt) {
	var o = {
		"M+": this.getMonth() + 1, //月份 
		"d+": this.getDate(), //日 
		"h+": this.getHours(), //小时 
		"m+": this.getMinutes(), //分 
		"s+": this.getSeconds(), //秒 
		"q+": Math.floor((this.getMonth() + 3) / 3), //季度 
		"S": this.getMilliseconds() //毫秒 
	};
	if (/(y+)/.test(fmt)) {
		fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
	}
	for (var k in o) {
		if (new RegExp("(" + k + ")").test(fmt)) {
			fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k])
				.length)));
		}
	}
	return fmt;
}
//N天时间戳，时间戳指从1970-01-01 0点开始到某天的毫秒数
function timestamp(days) {
	return days * 24 * 60 * 60 * 1000
}

//几天前，一般以现在的时间为基准，参数默认值老的浏览器可能不支持。
function days_ago(day, base_time = Date.now()) {
	return new Date(base_time - timestamp(day))
}
//最常用的今天、昨天、明天，返回时间戳
function yesterday(){
	return days_ago(1)
}
function tomorrow(){
	return days_ago(-1)
}
function today(){
	return new Date()
}

///字符串格式化的日期，英文常用，如2021-01-01
function en_format(func){
	return func.format('yyyy-MM-dd')
}
function en_today(){
	return en_format(today())
}
function en_yesterday(){
	return en_format(days_ago(1))
}
function en_tomorrow(){
	return en_format(days_ago(-1))
}

function cn_format(func){
	return func.format('yyyy年MM月dd日')
}
//中文版今天，如2020年02月22日
function cn_today(){
	return cn_format(today())
}
//中文版昨天，如1949年10月01日
function cn_yesterday(){
	return cn_format(days_ago(1))
}
//中文版明天，如2035年09月09日
function cn_tomorrow(){
	return cn_format(days_ago(-1))
}

使用方法

cn_today()
'2021年11月10日'
cn_tomorrow()
'2021年11月11日'
cn_yesterday()
'2021年11月09日'
    
en_today()
'2021-11-10'
en_tomorrow()
'2021-11-11'
en_yesterday()
'2021-11-09'

7天前

en_format(days_ago(7))
'2021-11-03'

代码还能再精简，不过于我是已经够用了。

我是@爱玩的安哥，关注我获取更多有用知识

在线咨询

上一篇：纯CSS 实现格子背景（国际象棋棋盘） - 掘金
下一篇：html文件删除如何恢复？恢复误删html文件教程

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。

整合营销服务商