js和css怎么加时间戳

为什么需要给js和css怎么加时间戳呢?原因:浏览器会缓存之前的js,css的版本,我们更新了js,css文件后,浏览器不会更新。所以我们在引入相关css、js文件时使用时间戳,能够让浏览器加载我们的最新版本。下面为各位介绍下如何给js和css加时间戳吧。

1、单个css,js文件添加时间戳

<script>
var now = new Date().getTime();
document.write('<link href="./css/today.css?v=' + now + '"
     rel="stylesheet" type="text/css"/>');
</script>
<script>
var now = new Date().getTime();
document.write('<script src="./js/today.js?v='
     + now + '"><\/script\>');
</script>

2、单个css.js文件添加随机数

(相关课程推荐:JS视频教程

document.write('<link href="./resess.css?' + Math.random()
     + '" rel="stylesheet" type="text/css"/>');
document.write('<script src="./index.js?' + Math.random()
     + '"><\/script\>');

3、多个css,js文件添加随机数效果图

<script>
  (function () {
    var random = Math.random();
    //处理请求JS文件缓存
    var element = document.getElementsByTagName("script");
    for (var i = 0; i < element.length; i++) {
      if (element[i].src) {
        if (element[i].src.indexOf('?') > -1) {
          element[i].src = element[i].src + '&timestreap=' + random;
        } else {
          element[i].src = element[i].src + '?timestreap=' + random;
        }
      }
    };
    //处理CSS文件缓存
    var link = document.getElementsByTagName("link");
    for (var i = 0; i < link.length; i++) {
      if (link[i].href) {
        link[i].href = link[i].href + '?timestreap=' + random;
      }
    }
  })()
</script>

css多文件不建议都加随机数,建议用单文件添加时间戳的方式,避免ui框架加上随机数后造成的闪屏的现象。

更多JavaScript相关技术文章,请访问JavaScript答疑栏目进行学习!

以上就是js和css怎么加时间戳的详细内容,更多请关注易知道|edz.cc其它相关文章!

推荐阅读