【浏览器缓存问题】HTML静态文件中,css和js可以添加版本号来刷新缓存,但是只是修改的文字了呢

html-css02

【浏览器缓存问题】HTML静态文件中,css和js可以添加版本号来刷新缓存,但是只是修改的文字了呢,第1张

给网址后面添加一个随机数(或者是任意的字符串)即可,比如原来的网址是这样的:

http....../.../1.htm

改为

http....../.../1.htm?1234

即可(注意问号不能省)。

浏览器是根据网址来缓存的,所以只要给网址接个尾巴,浏览器就会认为是新网址,就会从网上重新下载数据了。当然,如果下次再次改变了网页内容,这个尾巴就要再次修改。

给css和js添加所谓版本号其实也是同一个原理。这个版本号其实就是给css和js的网址接个尾巴而已。

这个也同样适用网页里面的图片、音乐等资源,事实上只要是http协议的元素都可以利用这个办法来避开缓存实时刷新。

怎样解决css缓存的问

步骤1/6

新建一个html文件,命名为test.html,用于讲解怎样解决css缓存的问题。

步骤2/6

在test.html文件中,使用div标签创建一个模块,用于测试。

步骤3/6

在test.html文件中,给div标签添加一个class属性,用于样式的设置。

步骤4/6

新建一个css文件,命名为test.css,在文件内通过class定义div的css样式 ,设置其宽度为200px,高度为200px,背景颜色为红色。

步骤5/6

在test.html文件中,在js标签内,使用write()方法输出css文件的link标签,并在css路径的末尾通过日期对象随机一个数字。

步骤6/6

在浏览器打开test.html文件,查看页面效果,css文件就不会缓存了。

1、使用div标签创建一个模块,创建一个css文件。

2、在js中,通过class获得div对象,使用write()方法输出css文件的link标签,并在css路径的末尾通过日期对象随机一个数字。