引用css和js文件的链接地址中带问号是什么意思?

在一些网站里面，我们经常会看到其引用的css和js文件地址里面带有问号并且后面跟有参数，一般情况下，带了问号也并不代表它是一个新生成的文件，其类似一个可以变化的版本号或者日期之类的标记，并被浏览器当做一个新的文件来加载，并不会影响到原文件内容的调用和改变。下面我们来详细了解下：

css和js文件调用链接中带问号的作用：

① 用于查看更改后的css或者js文件记录。比如我们在问号后面添加日期，test.css?version=20230627，或者版本号：test.js?ver=6.2.2,在以后我们再次查看的时候就知道这个文件最后更改时间以及版本。

② 避免css或者js修改后因为浏览器缓存导致修改后效果不起作用，或者需要CTRL+F5强制刷新才能显示网站修改后的效果，但是作为一般用户，在多次浏览同一个网站时，很少会去强制刷新浏览缓存，这就可能会导致用户看到的可能是之前没有修改过的页面。

这个时候我们就可以通过在css或者js后面加?+随机数字来让浏览器认为这是一个新的文件，跳过浏览器缓存，直接从网站服务器下载新的文件。(有时候我们在修改过网站css或者js文件后，发现前端并没有变化，或者需要更新下网站缓存才会有变化，就是因为浏览器调用了之前缓存的文件，而不是重新加载修改后的文件)

如何自动添加问号后面的参数？

在实际的操作过程中，如果我们每修改一次css或者js文件就要再修改以下问号后面的参数值，那么会非常的麻烦，所以我们可以采用自动生成的方式改变文件后面的数值，最简单的方式是调用当前Unix时间戳当做参数，这样随时都会变，且每次都不一样。

实现方法：在原有的文件后面加上时间获取代码，如下所示：

<link rel="stylesheet" href="test.css?version=<?php echo time();?>">

在用Wordpress建设的网站中已经测试过可用。

如何通过.htaccess设置静态资源缓存？

上面讲的在css或者js中添加版本号参数可以绕开浏览器里面的缓存重新下载文件，但这样做也有一个弊端，每次打开页面都需要重新下载，势必会拖慢网站打开速度；因此有时候我们也可以不加问号，并且将一些不经常改动的文件让它留在浏览器缓存里面，并做相应设置，比如留存时间等，以提高网站的打开速度。一种常见的方法是通过.htaccess设置静态资源缓存，方法如下：

步骤一：打开Apache服务器根目录下的AppServ/Apache24/conf/httpd.conf文件,开启以下两项(把前面的#号去掉)：

LoadModule headers_module modules/mod_headers.so

LoadModule rewrite_module modules/mod_rewrite.so

步骤二：在对应网站根目录下找到 .htaccess文件，如果没有可以先建，然后加入以下代码：

# 1 Month for all your static assets
<FilesMatch ".(ico|pdf|bmp|vbs|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=2592000, public"
</FilesMatch>
# 1 DAY for rss feeds and robots
<FilesMatch ".(xml|txt)$">
Header set Cache-Control "max-age=86400, public, must-revalidate>
</FilesMatch>
# 8 HOURS for your real articles files
<FilesMatch ".(html|htm)$">
Header set Cache-Control "max-age=28800, must-revalidate>
</FilesMatch>


因为缓存有效时间是按秒来算，所我们通过比如max-age=2592000（秒）来设置缓存的有效期。

步骤三：重启Apache服务器。

如果文件后面加了带问号的可变参数，还会被当做新文件重新下载，其优先级是高于浏览器缓存里面文件的（即使已经做过相关的设置。）