背景
在搜索引擎中搜索关键字.htaccess 缓存,你可以搜索到很多关于设置网站文件缓存的教程,通过设置可以将css、js等不太经常更新的文件缓存在浏览器端,这样访客每次访问你的网站的时候,浏览器就可以从浏览器的缓存中获取css、js等,而不必从你的服务器读取,这样在一定程度上加快了网站的打开速度,又可以节约一下你的服务器流量。
问题
现在问题来了,.htaccess设置的css、js缓存都有一个过期时间,如果在访客的浏览器中已经缓存了css、js,在这些css、js缓存未过期之前,浏览器只会从缓存中读取css和js,如果你在服务器上修改了css和js,那么这些更改在回头客的浏览器中是不会有变化的,除非回头客按了Ctrl + F5刷新了你的网站页面或者手动清空了浏览器的缓存。一个网站的访客成千上万,回头客也会有不少,你不可能在更新css后让每个访客都刷新一下缓存吧,那么这个问题你会怎么处理呢?
处理办法
1.更改css文件名:其实解决这个问题很简单,缓存是通过文件名标记缓存的内容的。在你更新了网站的css文件内容后,在更换一下css的文件名就可以了。如原先html中的css调用语句如下:
<link rel="stylesheet" href=“http://www.example.com/style.css” type="text/css" media="screen" />
改一下css文件名就可以了:
<link rel=“stylesheet” href="http://www.example.com/index.css" type="text/css" media="screen" />
另外一种从更改css文件名的方法是将版本号写到文件名中,如:
<link rel="stylesheet" href="http://www.example.com/index.v2011.css" type="text/css" media="screen"/>
css文件更新后,改一下文件名中的版本号即可:
<link rel="stylesheet" href="http://www.example.com/index.v2012.css" type="text/css" media="screen"/>
2.给css文件加个版本号:其实每次修改css文件后还要修改css的文件名有点麻烦,那么我们可以在加载css语句中加入个版本号(即css链接中?后面的内容)就可以了。如原先html中的css调用语句如下:
<link rel="stylesheet" href=“http://www.example.com/style.css?v=2011”type="text/css" media="screen"/>
改一下css文件的版本号改成2012就可以了:
<link rel="stylesheet" href=“http://www.example.com/style.css?v=2012”type="text/css" media="screen"/>
总结
其实css文件后面的问号起不到实际作用,仅能当作后缀,如果用问号加参数的方法,可以添加版本号等信息,同时可以刷新一下浏览器端的缓存。一个小小的细节,可以给我们带来很大的方便。
原文地址:http://www.ludou.org/css-version.html
分享到:
相关推荐
示例描述:介绍JavaScript管理cookie和userData。 11.1.html JavaScript写数据到cookie。 11.2.html JavaScript获取cookie信息。 11.3.html JavaScript修改cookie的保存有效期。 11.4.html 保存数据...
1.3 JavaScript的版本 1.4 一些值得留意的特性 禁忌及如何突破这些禁忌 1.5 安全性和执行效率 1.6 一个例子--JavaScript编写的计算器 1.7 学习和使用JavaScript的几点建议 1.8 关于本书的...
新项目入门套件 该入门工具包由具有CRUD功能的... 如果看到版本号,例如v14.2.0 ,请继续使用 如果未安装Node,请并安装(或使用 ),然后继续 开始使用 分叉或克隆此存储库,安装依赖项,添加环境变量,然后开始:
产品特点实时重装更改后浏览器更新自动优化条目文件连接,缩小并将输出文件注入HTML 的样式表现代JavaScript 的基于ES6模块的代码 较旧的浏览器支持使用在CSS中添加供应商前缀将ES6 +代码转换为与向后兼容包括: ...
Chrome Frame 会把最新版的Chrome Webkit 内核和JavaScript 引擎注入到IE中, IE浏览器将获得Chrome的性能和功能 目录 摘要 I ABSTRACT II 专业名词清单 III 第一章 绪论 1 1.1 研究背景与意义 1 1.2国内外相关...
HTML + JavaScript + Ajax + CSS 赵旭 zhaoxu@tedu.cn HTML5 1、WEB基础知识(了解) 1、Internet - 网 由若干台电脑、手机、平板 通过 网线(WIFI) 连接起来的结构 2、基于Internet上的程序 1、C / S 结构 ...
1_5.htm 在HTML中引用JavaScript的变量。 1_6.htm 比较undefined和"undefined"。 第2章(\2) 示例描述:客户端的流程控制。 2_1.htm 条件判断语句if…else 2_2.htm 多条件判断语句switch。 2_3.htm 嵌套...
1_5.htm 在HTML中引用JavaScript的变量。 1_6.htm 比较undefined和"undefined"。 第2章(\2) 示例描述:客户端的流程控制。 2_1.htm 条件判断语句if…else 2_2.htm 多条件判断语句switch。 2_3.htm 嵌套...
2.选择浏览器的“工具”-“安全”-“本地Intranet”-“自定义级别”-“活动脚本”中选用“禁用”单选框 3.在浏览器中输入下述地址:http://localhost/1.2.htm • 1.1.htm 多段代码相互调用 • 1.2....
用户可以添加图书数据,例如其标题,ISBN代码,版权,版本号及其作者(作者可以是多个)。 然后,用户可以编辑,删除和搜索数据。 它使用以下技术。 前端:HTML,CSS,Javascipt,JSP。 服务层:JSP自定义标签后端...
IE 5或更高版本 Mozilla Firefox 1.5.0.3或更高版本 服务器采用IIS5.1 或以上版本 数据库使用MS Access 2000以上 2.本书所附光盘实例代码: 第1章(\第1章) 查看1.2.htm中noscript显示效果的方法如下: 1.将...
JavaScript:定义行为和动作 (基于对象和事件驱动的客户端脚本语言;也是一种广泛应用于客户端Web开发的脚本语言) 基于对象:网页中的一切元素都是假象!不需要new,即可直接使用 事件驱动:JavaScript的执行都是...
JSEditor 是 Eclipse 下编辑 JavaScript 源码的插件,提供语法高亮以及一些通用的面向对象方法。 Java数据库连接池 BoneCP BoneCP 是一个高性能的开源java数据库连接池实现库。它的设计初衷就是为了提高数据库连接...
Javascript小技巧一箩筐 事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture(); event.srcElement.releaseCapture(); 事件按键 event.keyCode ...
借助Speed Tracer,您可以更好地了解在应用程序中的哪些地方消耗了时间,并可以解决JavaScript语法分析和执行、CSS式样以及更多方面的问题。 Resolution Test,它可以改变浏览器窗口大小,从而使网站开发者可以在...
Notes网站 Notes网站允许用户创建帐户并... 通过在Apache / conf / httpd文件末尾添加PHPIniDir,LoadModule和AddHandler行将PHP连接到Apache, num表示版本号,该数字可能有所不同,并且php文件夹的位置也可能有所不同
07 软连接和硬链接补充 第7章 01 ip地址与子网划分 02 ip地址配置 03 虚拟机网络模式 04 三层隔离验证试验 第8章 01 上节课复习 02 软件包介绍 03 rpm软件包管理 04 yum软件包管理 05 源码安装python3.5 06 ssh...
项目描述:OA办公系统...运用HTML/JavaScript/CSS技术实现标准、规范的客户端静态和动态效果 手动分页 缓存 DB_51aspx下为Sql2005数据库,附加后批量修改web.config中的数据库连接信息 默认帐号/密码:51aspx/51aspx
JSEditor 是 Eclipse 下编辑 JavaScript 源码的插件,提供语法高亮以及一些通用的面向对象方法。 Java数据库连接池 BoneCP BoneCP 是一个高性能的开源java数据库连接池实现库。它的设计初衷就是为了提高数据库连接...
JSEditor 是 Eclipse 下编辑 JavaScript 源码的插件,提供语法高亮以及一些通用的面向对象方法。 Java数据库连接池 BoneCP BoneCP 是一个高性能的开源java数据库连接池实现库。它的设计初衷就是为了提高数据库连接...