网页中只渲染日期不显示时间的解决方法-技术文档

在网页前端渲染中，想要只显示日期不显示时间，是如何做到的？先分析一下：由于日期的字符数不固定，需要进行判断，下面有3种日期情况【第一种月和日只有1个字符；第二种月有2个字符，日有1个字符；第三种月和日分别有2个字符，如下提示】，DOM结构分别是：

1. < span class="daymd" >2021/2/18 16:15:07< /span>

2. < span class="daymd" >2021/12/8 16:15:07< /span>

3. < span class="daymd" >2021/12/18 16:15:07< /span>

下面是 JavaScript 进行操作的代码逻辑，其中使用jquery中.each()和.text()方法，还有js中.slice()方法，进行三种日期情况判断操作，如下：

备注：请自行引用库如：jquery-1.8.3.min.js

< script>

$(".daymd").each(function() {

//console.log($(this).text().length);

if ($(this).text().length==17){//当日期有17个字符数

$(this).text($(this).text().slice(0,8))//截取前面的8个字符

}else if ($(this).text().length==18){

$(this).text($(this).text().slice(0,9))

}else if ($(this).text().length==19){

$(this).text($(this).text().slice(0,10))

};

$(this).text($(this).text().replace(/\//g,"-"));//将所有的斜杠替换成中横杠

});

< /script>

备注：网站开发者引用本文代码的请注意：标签 span script 中有空格的请自行删除测试，本文演示是为了防止上面代码不被后台编辑器解析。