前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >网页添加一个加载耗时显示

网页添加一个加载耗时显示

作者头像
岳泽以
发布2022-10-26 16:28:29
6750
发布2022-10-26 16:28:29
举报
文章被收录于专栏:岳泽以博客

很多小伙伴的网页底部都有一个加载耗时xx毫秒的显示:

这个其实是用js实现计算加载页面所用的时间然后反馈出来的。

首先在页面Head部分加入初始时间:

代码语言:javascript
复制
 <script language=javascript> 
var t1 = new Date().getTime(); 
</script> 

接着在body页面加入以下代码:

代码语言:javascript
复制
 <SCRIPT LANGUAGE="JavaScript"> 
window.onload = function() 
{ 
document.getElementById("TimeShow").innerHTML = "加载本页耗时 "+ (new Date().getTime()-t1) +" 毫秒"; 
} 
</SCRIPT> 

最后在需要显示的地方插入一个ID为TimeShow的标签即可

<div id="TimeShow"></div>

注意:如果你的网站使用了pjax无刷新加载,那么这个效果只会在第一次进入网站的时候或者手动刷新的时候才会生效,否则一直保持为首次加载时间。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022 年 01 月,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档