HTML、CSS、Javacript、浏览器清除缓存几种方法

本人在开发推广页中经常会遇到HTML、CSS、JS、浏览器缓存问题，如：推广页内容不断维护更新、不可能让用户自己清除缓存数据而更新内容，用户体验很不友好。所以必须开发人员处理好缓存问题。下面整理清除缓存几种办法。

1、用HTML标签设置HTTP头信息

说明：HTTP头信息“Expires”和“Cache-Control”为应用程序服务器提供了一个控制浏览器和代理服务器上缓存的机制。HTTP头信息Expires告诉代理服务器它的缓存页面何时将过期。HTTP1.1规范中新定义的头信息Cache-Control可以通知浏览器不缓存任何页面。当点击后退按钮时，浏览器重新访问服务器已获取页面。如下是使用Cache-Control的基本方法：
　　1) no-cache:强制缓存从服务器上获取新的页面 　　2) no-store: 在任何环境下缓存不保存任何页面
　　HTTP1.0规范中的Pragma:no-cache等同于HTTP1.1规范中的Cache-Control:no-cache，同样可以包含在头信息中。

通俗点：HTML页面配置meta方法实现浏览器清除缓存

2、在需要打开的url后面增加一个随机的参数：
例如：
css缓存问题

css样式： 增加之前url='css/style.css'
          增加之后url='css/style.css?1'

图片缓存问题

图片更新： 增加之前url='./images/img.jpg'
          增加之后url='./images/img.jpg?1'

js缓存问题

js文件： 增加之前url='./js/index.js'
         增加之后url='./js/index.js?1'

说明：因为每次请求的url后面的参数不一样，相当于请求的是不同的页面，用这样的方法来曲线救国，清除缓存

css和js带参数（形如.css?t=与.js?t=） 使用参数有两种可能：

第一、脚本并不存在，而是服务端动态生成的，因此带了个版本号，以示区别。 即上面代码对于文件来说 等价于 但浏览器会认为他是
该文件的某个版本！
第二、客户端会缓存这些css或js文件，因此每次升级了js或css文件后，改变版本号，客户端浏览器就会重新下载新的js或css文件
，刷性缓存的作用。 第二种情况最多，也可能两种同时存在。
版本号，可以是一个随机数，也可以是一个递增的值，大版本小版本的方式，或者根据脚本的生成时间书写，比如就是精确到了生成脚本的秒，而 2.3.3就是大版本小版本的方式。

3.用随机数，随机数也是避免缓存的一种很不错的方法！
URL 参数后加上 “?ran=” + Math.random(); //当然这里参数 ran可以任意取了 。 eg:

其他的类似，只需在地址后加上+Math.random() 注意：因为Math.random() 只能在Javascript
下起作用，故只能通过Javascript的调用才可以

4.用随机时间，和随机数一样。

在 URL 参数后加上 "?timestamp=" + new Date().getTime();

5.添加版本号（如 layout.css?v=1）

6.ajax方法
方式一：用ajax请求服务器最新文件，并加上请求头If-Modified-Since和Cache-Control,如下:

$.ajax({
     url:'www.haorooms.com',
     dataType:'json',
     data:{},
     beforeSend :function(xmlHttp){ 
        xmlHttp.setRequestHeader("If-Modified-Since","0"); 
        xmlHttp.setRequestHeader("Cache-Control","no-cache");
     },
     success:function(response){
         //操作
     }
     async:false
  });

方法二，直接用cache:false,

 $.ajax({
     url:'www.haorooms.com',
     dataType:'json',
     data:{},
     cache:false, 
     ifModified :true ,
     success:function(response){
         //操作
     }
     async:false
  });

7.window.location.replace(“WebForm1.aspx”);
参数就是你要覆盖的页面，replace的原理就是用当前页面替换掉replace参数指定的页面。
这样可以防止用户点击back键。使用的是javascript脚本，举例如下：
a.html
以下是引用片段：

 
      
               
          
      
      
        b 
     
  

b.html
以下是引用片段：

 
      
               
          
      
      
        a 
     
  

目前项目中经常运用1、2、3、4、5 解决方法至于6、7方法大家可以试试，相信也可以起到清楚缓存作用。