在js中或css中加入?v=版本号

html-css012

在js中或css中加入?v=版本号,第1张

添加版本号的原因,可能是因为想要强制浏览器不缓存js和css。

1、推荐自动化构工具, webpack之类的,每次写完编译文件,自动生成不同的版本的js,css,当然也有小插件可以做到。

2、就是在?v=时间戳,可以把加载js脚本,统一放在一个js里面 ,声明时间戳。

自定义的版本.

例如昨天你修改了css文件,然后你调用css文件时可以这样引用。

<link type="text/css" rel="stylesheet" href="common.css?v=201106025"/>

今天你又对css文件作了修改,那你调用css文件时改下日期,说明这css是今天修改的。

<link type="text/css" rel="stylesheet" href="common.css?v=201106026"/>

这方便程序员识别css是什么时候修改过至于,也可以让客户端即时下载最新的css样式。防止缓存.

如果css文件缓存时间是3天时间,并且你引用css文件用以下方式:

<link type="text/css" rel="stylesheet" href="common.css"/>

那么游客昨天浏览过你的网站。客户端将会对common.css保留到后天,这3天时间内无论游客反复访问你的网站。common.css文件都不会从你的站点下载,而是直接读取缓存在本地计算机的common.css。

但刚好今天你修改过common.css文件,这是该游客的客户端不会因为你修改过css文件而立即从新下载最新的css文件。

因此如果你想客户端能即时下载最新的css文件:

1、要么就是让客户端清楚浏览器缓存,不太实际的做法。

2、不设置css文件的缓存时间,意思就算游客每刷新一次页面都会从新下载css文件。这么以来你服务器的负担就会增大。

3、就是你所问,common.css后面带参数。这样客户端浏览时发现之前的css文件路径与当前的css文件路径不相同,就会立即下载最新的css文件了。

css后面加参数主要是起到一个缓存更新的作用。

比如style.css?v=1.0,客户端打开后会缓存1.0版本的css文件,而你在下次升级css文件后,文件名不改,那么没有清理过缓存的浏览器就会出现样式错误或者是旧样式。如果你改成style.css?v=2.0 ,就不会出现这样的问题,浏览器就会识别为新的css文件来重新加载。