我们开发web项目的时候,如果更新了某个css文件,部署到服务器,发现在浏览器访问的时候,并没有什么变化,这是因为浏览器缓存了之前的旧的css文件。如果过一段时间之后再访问,就会发现页面有了变化,这说明浏览器更新了最新的css文件。
那么怎么才能使我们修改的css或js文件立马生效呢?
如果每次都强制更新最新的文件,这样做从效率上来讲又不是很好。我们还是希望有缓存的,只是当我们修改了文件之后,才立马把这个缓存更新掉。
下面介绍一种最简单的方法:
就是在引用的js或css文件后面加版本号v=xxx。
比如原来代码是下面这样:
<link href="css/mycss.css" rel="stylesheet" type="text/css"> <script type="text/javascript" src="js/myjs.js"></script>我们可以改成下面这样:
<link href="css/mycss.css?v=100" rel="stylesheet" type="text/css"> <script type="text/javascript" src="js/myjs.js?v=100"></script>后面新加的?v=100就是相当于一个版本号。如果该版本号没有变化,浏览器就不会更新缓存。如果我们需要修改css文件,就可以把版本号改成v=101,当我们再次访问页面的时候,浏览器发现版本号变了,就会拿最新的css文件,即更新缓存,这样就达到我们的目的了。
是不是很简单?如果解决了您的问题,那就没白写~
分享技术,分享快乐!欢迎打赏~