如何在引用javascript、css文件时添加时间戳,解决浏览器缓存问题
浏览器会缓存之前的javascript,css的版本,更新了javascript,css文件后,浏览器不会更新。所以在引入相关javascript、css文件时添加一个时间戳,能够让浏览器加载我们的最新版本。<link rel="stylesheet" href="/css/element.css?_t=<%=new Date().indexOf()%>"><scri
·
问题产生原因:
如果在用户之前已经访问过系统,那么浏览器中会缓存该系统的CSS、JS,这些CSS、JS缓存未过期之前,浏览器只会从缓存中读取CSS和JS,如果在服务器上修改了CSS和JS,那么这些修改在用户的浏览器中是不会有变化的。
解决方式一:
用户按Ctrl + F5强制刷新页面或者手动清空了浏览器的缓存。此时浏览器会重新向服务器获取CSS和JS文件,新的文件便会生效。
但是用户量过大的时候总不能让每个用户一一清理缓存吧,于是便从代码的角度着手解决这个问题。在CSS、JS后面添加版本号,让浏览器把CSS、JS文件当做新的文件重新向服务器获取资源。
解决方式二:在CSS、JS后面添加时间戳
<link rel="stylesheet" href="/css/element.css?_t=<%=new Date().indexOf()%>">
<script type="text/javascript" href="/js/element.js?_t=<%=new Date().indexOf()%>"></script>
关于<%%>、<%=%>、<%:%>的使用方法:HTML代码中<%%>、<%=%>、<%:%>
浏览器清除缓存:
-
方式一:
Ctrl + F5强制刷新页面 -
方式二:
第一步:
第二步:鼠标右键点击清空缓存并硬性重新加载
-
方式三:打开浏览器设置,找到安全与隐私设置,选择清除浏览数据
更多推荐
已为社区贡献2条内容
所有评论(0)