讓瀏覽器不載入緩衝CSS和JS的方法

現在大多數瀏覽器都會緩衝網站上的圖片、CSS 和 JS 檔案，以提高載入速度。當你的網站修改 CSS 和 JS 的時候往往因為緩衝的原因無法立刻生效。

這樣舊的 CSS 和新的 Html 就可能會導致錯誤，這裡有個小技巧，可以保證瀏覽器不會緩衝 CSS 和 JS，只需要在檔案結尾隨便加點參數即可，這樣瀏覽器就會認為這是不同的檔案。

代碼如下	複製代碼
<link rel="stylesheet" type="text/css" href="/style.css?ver=123" />

如果用 PHP 把現在的時間作為版本號碼，這樣每次都會重新載入：

代碼如下	複製代碼
<link rel="stylesheet" type="text/css" href="/style.css?ver=<?php echo time(); ?> " />

當然這樣做會付出代價，完全打破瀏覽器的緩衝機制，導致每次都會重新載入相同的 CSS 和 JS

最好的解決方案應該是只有在 CSS 和 JS 檔案被修改的時候才會重新載入。這裡要介紹一個 PHP 的 filemtime() 函數，filemtime() 函數可以返迴文件最後被修改的時間，這樣只有在修改檔案的時候版本才會變化。

代碼如下	複製代碼
<?php $css = '/style.css' ?> <link rel="stylesheet" type="text/css" href="?ver=<?php echo $css . filemtime( $css ); ?>" />

WordPress

如果你使用 WordPress，可以通過 WordPress 提供的指令碼排隊機制掛載指令碼：

代碼如下	複製代碼
$css = get_stylesheet_directory() . '/css/style.css'; wp_enqueue_style( 'style', $css, NULL, filemtime( $css ) );