Web Design
Mobile Internet
Brand Design
Innovative
News
Encyclopedias

如何更新緩存HTML中css和js鏈接

Date:2012-02-16 Aource:尚品中國 Type:網(wǎng)站百科
Word Size:small  medium  big

北京網(wǎng)站建設(shè)公司尚品中國:在搜索引擎中搜索關(guān)鍵字.htaccess 緩存,你可以搜索到很多關(guān)于設(shè)置網(wǎng)站文件緩存的教程,通過設(shè)置可以將css、js等不太經(jīng)常更新的文件緩存在瀏覽器端,這樣訪客每次訪問你的網(wǎng)站制作的時候,瀏覽器就可以從瀏覽器的緩存中獲取css、js等,而不必從你的服務(wù)器讀取,這樣在一定程度上加快了網(wǎng)站的打開速度,又可以節(jié)約一下你的服務(wù)器流量。

現(xiàn)在問題來了,.htaccess設(shè)置的css、js緩存都有一個過期時間,如果在訪客的瀏覽器中已經(jīng)緩存了css、js,在這些css、js緩存未過期之前,瀏覽器只會從緩存中讀取css和js,如果你在服務(wù)器上修改了css和js,那么這些更改在回頭客的瀏覽器中是不會有變化的,除非回頭客按了Ctrl + F5刷新了你的網(wǎng)站頁面或者手動清空了瀏覽器的緩存。一個網(wǎng)站的訪客成千上萬,回頭客也會有不少,你不可能在更新css后讓每個訪客都刷新一下緩存吧,那么這個問題你會怎么處理呢?

處理辦法

1.給css文件加個版本號:其實每次修改css文件后還要修改css的文件名有點麻煩,那么我們可以在加載css語句中加入個版本號(即css鏈接中?后面的內(nèi)容)就可以了。如原先html中的css調(diào)用語句如下:

<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"/>


2.更改css文件名:其實解決這個問題很簡單,緩存是通過文件名標(biāo)記緩存的內(nèi)容的。在你更新了網(wǎng)站的css文件內(nèi)容后,在更換一下css的文件名就可以了。如原先html中的css調(diào)用語句如下:

<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"/>

其實css文件后面的問號起不到實際作用,僅能當(dāng)作后綴,如果用問號加參數(shù)的方法,可以添加版本號等信息,同時可以刷新一下瀏覽器端的緩存。一個小小的細節(jié),可以給我們帶來很大的方便。

本文發(fā)布于北京網(wǎng)站制作公司尚品中國http://m.proteomeinstitute.com/
?

Please contact our consultant

+86 10-60259772

Please provide your contact number. The project manager of shangpin China will contact you as soon as possible.