时间前：如何显示出版日期作为时间以来的时间-IT业界-PHP中文网

首页

科技周边

IT业界

时间前：如何显示出版日期作为时间以来的时间

Lisa Kudrow

Feb 19, 2025 pm 12:02 PM

时间前：如何显示出版日期作为时间以来的时间

钥匙要点

>显示出发布日期以来发布的时间以来的时间，例如“ 2分钟前出版”，可以增加与听众的新鲜感和互动感，而不是“ 2016年9月12日出版”。 >
元素可用于显示这些动态日期，并提供[DateTime]属性提供的后备值，以确保更好的可访问性。 [title]属性可用于显示光标放置在日期文本上的确切日期。 JavaScript
>通常以2015年9月12日或09/12/2015，09：41:23和2015-09-12发布的格式在网络上呈现日期。

> 这样的日期格式似乎是完全合理的。毕竟，它们是有益的和可读的！好吧，是的，但是“人类阅读”并不是必需的，这意味着用户很容易理解该活动的发生方式。网络是一个快速移动的地方，让您的内容具有新鲜感可能是与观众互动的关键！因此，让我们看一下如何改进这些共同的日期格式。

一个小技巧

>再次，假设您已经偶然发现了几分钟前出版的帖子，但是帖子的副标题指出了：

于2016年9月12日发布

…或此：

>发表于2016-09-12，09：41:23

这些消息的问题在于，它们没有传达出您的网站刚刚更新或您经常这样做的感觉。因此，肯定会更诱人，而且更清晰地以这种方式呈现时间：

2分钟前出版

>

以前看过很多次吗？但是，你们中有多少人将其建立在您的项目中？以Facebook为例：如果他们在我的第一个示例中呈现最新内容的日期，那会是什么样？在以下图像中比较左右列：

左专栏的日期不那么吸引人，是吗？我敢打赌，右手示例对您更具吸引力。知道内容很新鲜非常重要 - 尤其是在社交网络上，人们更有可能忽略旧时间或不清晰的时间戳。
>
>打印更好的日期

为了提供更好的日期，您需要一些服务器端脚本，我将使用PHP进行此演示。我创建了一个称为time_ago（）的微小函数，如下所示：>
<?php 
 define( TIMEBEFORE_NOW, 'now' );
 define( TIMEBEFORE_MINUTE, '{num} minute ago' );
 define( TIMEBEFORE_MINUTES, '{num} minutes ago' );
 define( TIMEBEFORE_HOUR, '{num} hour ago' );
 define( TIMEBEFORE_HOURS, '{num} hours ago' );
 define( TIMEBEFORE_YESTERDAY, 'yesterday' );
 define( TIMEBEFORE_FORMAT, '%e %b' );
 define( TIMEBEFORE_FORMAT_YEAR, '%e %b, %Y' );

 function time_ago( $time )
 {
 $out = ''; // what we will print out
 $now = time(); // current time
 $diff = $now - $time; // difference between the current and the provided dates

 if( $diff return TIMEBEFORE_NOW;

 elseif( $diff return str_replace( '{num}', ( $out = round( $diff / 60 ) ), $out == 1 ? TIMEBEFORE_MINUTE : TIMEBEFORE_MINUTES );

 elseif( $diff return str_replace( '{num}', ( $out = round( $diff / 3600 ) ), $out == 1 ? TIMEBEFORE_HOUR : TIMEBEFORE_HOURS );

 elseif( $diff return TIMEBEFORE_YESTERDAY;

 else // falling back on a usual date format as it happened later than yesterday
 return strftime( date( 'Y', $time ) == date( 'Y' ) ? TIMEBEFORE_FORMAT : TIMEBEFORE_FORMAT_YEAR, $time );
 }

?>
让我们看一下此代码的一些细节。

您唯一必须提供的参数是$时间，它是Unix Timestamp中的日期 - 例如Time_ago（1442082961）。
>函数将返回的$ $时间的示例：

现在
- 如果发生在不到60秒之前（timebefore_now）> 3分钟前 - 如果不到60分钟前（timeborefore_minute（s））
>
8小时前 - 如果不到24小时前（timeborefore_hour（s））

昨天 - 如果不到48小时前（timeborefore_yesterday）
>
9月12日 - 如果超过48小时，并且发生在今年（timeborefore_format）
>
> 2015年9月12日 - 如果不是今年（timeborefore_format_year）。

> PHP定义用于将类似于配置的数据与功能代码分开（最好将所有Define（）出现放入配置文件中，将功能放入helpers File中）。
> 定义中的
{num}用实际数字（分钟或小时）代替。
我使用strftime（）而不是date（）来避免语言/语言问题。
>
例如

，或者是其他一些假设的CMS：

或静态方式：
=time_ago( get_the_time( 'U' ) )?>
>可访问性和可用性
=time_ago( $post->date_created )?>
>您应该使用一个特定的HTML元素来呈现日期：。在我们的情况下，使用time_ago函数时，时间元素的值并不总是以有效的日期格式（例如
昨天
=time_ago( 1447571705 )?>
或
> 3分钟前
>）。因此，您还应该使用[DateTime]属性：提供后备值
这将导致更好的可访问性，例如： 您是否发现了[title]属性？这是一个很小的可用性改进：将光标置于日期文本上显示标题属性中显示的消息。这是针对由于某种原因寻找“真实”日期的用户。这是CSS的小技巧，可以增强更多的感觉：
>
Published <time datetime="<?=date( 'Y-m-d', $time )?>" title="<?=strftime( date( 'Y', $time ) == date( 'Y' ) ? TIMEBEFORE_FORMAT : TIMEBEFORE_FORMAT_YEAR, $time )?>"> =time_ago( $time )?> </time>

Published <time datetime="2015-09-12" title="September 12">3 minutes ago</time>

> JavaScript增强

>我们还有一件事！您是否注意到Facebook还实时增加了日期？只需在3分钟内观看一分钟，它将变成4分钟，依此类推。因此，有类型的网站是一个非常不错的增强。在这样的文章中，它不会有用，但是在像ReadErrr这样的网站上是完美的：
>
<?php define( TIMEBEFORE_NOW, 'now' ); define( TIMEBEFORE_MINUTE, '{num} minute ago' ); define( TIMEBEFORE_MINUTES, '{num} minutes ago' ); define( TIMEBEFORE_HOUR, '{num} hour ago' ); define( TIMEBEFORE_HOURS, '{num} hours ago' ); define( TIMEBEFORE_YESTERDAY, 'yesterday' ); define( TIMEBEFORE_FORMAT, '%e %b' ); define( TIMEBEFORE_FORMAT_YEAR, '%e %b, %Y' ); function time_ago( $time ) { $out = ''; // what we will print out $now = time(); // current time $diff = $now - $time; // difference between the current and the provided dates if( $diff return TIMEBEFORE_NOW; elseif( $diff return str_replace( '{num}', ( $out = round( $diff / 60 ) ), $out == 1 ? TIMEBEFORE_MINUTE : TIMEBEFORE_MINUTES ); elseif( $diff return str_replace( '{num}', ( $out = round( $diff / 3600 ) ), $out == 1 ? TIMEBEFORE_HOUR : TIMEBEFORE_HOURS ); elseif( $diff return TIMEBEFORE_YESTERDAY; else // falling back on a usual date format as it happened later than yesterday return strftime( date( 'Y', $time ) == date( 'Y' ) ? TIMEBEFORE_FORMAT : TIMEBEFORE_FORMAT_YEAR, $time ); } ?>
最后，我们需要将PHP代码转换为JavaScript等效。我在Vanilla JS中为您完成了此操作（尽管也可以使用jQuery版本）。该脚本每分钟每分钟一次浏览一次[数据时]元素（settimeout（更新，1000 * 60）），并更新值：
>

=time_ago( get_the_time( 'U' ) )?>

在线演示和代码下载

>您可以查看上述代码的在线演示或下载完整的演示代码。
>另外一件事

在上面的示例中，如果活动发生在三天前或更多天之前，则会提供全日期。但是，像5天前，2周前和1个月前一样，扩展脚本以呈现时间很容易：
>

总结
=time_ago( $post->date_created )?>

用户体验和满意度已详细介绍。有时，一个简单的细节（例如动态日期格式）足以使我们的网站变得更好。
>那么，您如何看待这个解决方案？您会考虑在下一个项目上使用它吗？您对此有任何疑问吗？请在评论中让我知道。
顺便说一句，我希望有人能告诉Instagram人122W并不酷，而2.4岁将容易理解。那会更好，不是吗？
经常提出问题（常见问题解答），以计算“ ago”时间

>“ AGO”时间函数在JavaScript中如何起作用？它使用日期对象来计算当前时间和事件时间之间的差异。然后，根据差异的大小，将此差异转换为秒，几分钟，小时，几天，几周或几年。结果是一个字符串，该字符串以人为可读的格式表示经过的时间，例如“ 5分钟前”或“ 2天前”。应用程序？
要在您的Web应用程序中实现'AGO'时间函数，您需要创建一个以日期对象为输入的JavaScript函数，并返回代表经过的时间的字符串。此功能应计算当前时间和输入日期之间的差异，将此差异转换为适当的单元，并将结果格式化为字符串。然后，您可以在需要显示“ AGO”时间时调用此功能。
>
使用“ AGO”时间函数有什么好处？ “ AGO”时间函数并没有显示可能难以解释和比较的事件的确切日期和时间，而是以易于理解和与之相关的格式显示了经过的时间。这可以增强用户体验，并使您的Web应用程序更具吸引力和交互性。

>'ogo'时间函数可以处理未来日期吗？

是的，'ogo'''时间函数可以处理未来日期。如果输入日期比当前日期晚，则该功能将计算时间到事件的时间，而不是事件以来的时间。结果将是一个字符串，该字符串表示剩余时间以人为可读的格式，例如“在5分钟内”或“ 2天内”。
>
>我如何自定义“ AGO”时间函数以适合我的需求？
“ AGO”时间函数是高度自定义的。您可以修改功能以使用不同的时间单位，输出字符串的不同格式或用于整理经过时间的不同规则。如果需要，您还可以添加对不同语言或语言的支持。通过调整函数，您可以使其与Web应用程序的设计和功能完美匹配。
>'ogo'时间函数与所有浏览器兼容？功能基于标准的JavaScript功能，因此应与所有现代Web浏览器兼容。但是，在不同的浏览器和平台上测试您的代码总是一个好主意，以确保其正常工作正常。 “ AGO”时间功能可以处理时区。该功能使用日期对象，该对象会自动考虑用户设备的时区。这意味着，无论用户的位置或时区域如何，“ AGO”时间都将是准确的。
>
>如果它不正常工作，我该如何调试'ogo'时间？

如果“ AGO”时间函数无法正常工作，您可以使用Console.log（）方法打印输入日期，当前日期和计算的差异。这将帮助您确定功能中的任何错误或不一致之处。您还可以在浏览器的开发人员工具中使用调试器工具来逐步介绍该功能并详细检查其行为。

>我可以在移动应用程序中使用'AGO'时间函数？是的，您可以在移动应用程序中使用“ AGO”时间函数。 JavaScript是一种多功能语言，可以在包括移动应用在内的许多不同环境中使用。该功能应在移动应用程序中与Web应用程序中的功能相同。
>
>如何优化“ AGO”时间函数的性能？

以优化“ AGO”时间函数的性能，您可以使用诸如Memoization或Caching之类的技术。这些技术可以减少功能执行的计算数量，从而使其更快，更有效。您还可以通过仅在必要时更新“ AGO”时间而不是在每个页面加载或每一秒钟。

以上是时间前：如何显示出版日期作为时间以来的时间的详细内容。更多信息请关注PHP中文网其他相关文章！

声明

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

安卓首家接入DeepSeek背后：看见女性力量Mar 12, 2025 pm 12:27 PM

中国女性科技力量在AI领域的崛起：荣耀与DeepSeek合作背后的女性故事女性在科技领域的贡献日益显着。中国科技部数据显示，女性科技工作者数量庞大，在AI算法开发中展现出独特的社会价值敏感性。本文将聚焦荣耀手机，探究其率先接入DeepSeek大模型背后的女性团队力量，展现她们如何推动科技进步，重塑科技发展价值坐标系。 2024年2月8日，荣耀正式上线DeepSeek-R1满血版大模型，成为安卓阵营首家接入DeepSeek的厂商，引发用户热烈反响。这一成功背后，女性团队成员在产品决策、技术攻坚和用户

DeepSeek'惊人”盈利：理论利润率高达545%！Mar 12, 2025 pm 12:21 PM

DeepSeek公司在知乎发布技术文章，详细介绍了其DeepSeek-V3/R1推理系统，并首次公开关键财务数据，引发业界关注。文章显示，该系统单日成本利润率高达545%，创下全球AI大模型盈利新高。DeepSeek的低成本策略使其在市场竞争中占据优势。其模型训练成本仅为同类产品的1%-5%，V3模型训练成本仅为557.6万美元，远低于竞争对手。同时，R1的API定价仅为OpenAIo3-mini的1/7至1/2。这些数据证明了DeepSeek技术路线的商业可行性，也为AI大模型的高效盈利树立了

2025年最佳10个最佳免费反向链接检查器工具Mar 21, 2025 am 08:28 AM

网站建设只是第一步：SEO与反向链接的重要性建立网站只是将其转化为宝贵营销资产的第一步。您需要进行SEO优化，以提高网站在搜索引擎中的可见度，吸引潜在客户。反向链接是提升网站排名的关键，它向谷歌和其他搜索引擎表明您的网站权威性和可信度。并非所有反向链接都有利：识别并避免有害链接并非所有反向链接都有益。有害链接会损害您的排名。优秀的免费反向链接检查工具可以监控链接到您网站的来源，并提醒您注意有害链接。此外，您还可以分析竞争对手的链接策略，从中学习借鉴。免费反向链接检查工具：您的SEO情报员

美的推出首款DeepSeek空调：AI语音交互可实现40万条指令！Mar 12, 2025 pm 12:18 PM

美的即将发布搭载DeepSeek大模型的首款空调——美的鲜净感空气机T6，发布会定于3月1日下午1点30分举行。这款空调配备先进的空气智驾系统，可根据环境智能调节温度、湿度和风速等参数。更重要的是，它集成了DeepSeek大模型，支持超过40万条AI语音指令。美的此举引发业界热议，尤其关注白电产品与大模型结合的意义。不同于传统空调简单的温度设定，美的鲜净感空气机T6能够理解更复杂、更模糊的指令，并根据家庭环境智能调节湿度等，显着提升用户体验。

百度又一国民产品接入DeepSeek，是想开了还是跟风？Mar 12, 2025 pm 01:48 PM

DeepSeek-R1赋能百度文库与网盘：深度思考与行动的完美融合短短一个月内，DeepSeek-R1已迅速融入众多平台。百度凭借大胆的战略布局，将DeepSeek作为第三方模型伙伴，整合进自身生态系统，这标志着其“大模型搜索”生态战略的重大进展。百度搜索和文心智能体平台率先接入DeepSeek及文心大模型的深度搜索功能，为用户提供免费的AI搜索体验。同时，“百度一下，你就知道”的经典slogan回归，新版百度APP也整合了文心大模型和DeepSeek的能力，推出“AI搜索”、“全网信息提炼”