javascript - 所有文件的版本控制后缀

标签 javascript html css version

在我的 index.html 中,我有许多脚本和 css 文件,我有版本控制后缀,如下所示:

<html>
  <head>

    <link rel="stylesheet" type="text/css" href="/framework/compile/css/main.min.css?version=3.0">

  </head>
  <body>

    <script type="text/javascript" src="/framework/compile/js/app.min.js?version=3.0"></script>
    <script type="text/javascript" src="/framework/compile/js/app.min.js?version=3.0"></script>

  </body>
</html>

我还有一个 html View 目录和较小的 html 文件。每当我更新其中一个文件时,我都会增加次要版本号。例如,/framework/compile/css/main.min.css?version=3.0 变为 /framework/compile/css/main.min.css?version=3.1更新后。

但是,如果我进行重大站点更新并更改大部分文件,我会将版本号推送到 4.0。我不想手动更改每个文件的版本号。有没有一种简单易读的方法可以使用 javascript 变量或类似的东西来做到这一点。

我正在寻找这样的东西:

    <script>var version = "3.0";</script>
    <link rel="stylesheet" type="text/css" href="/framework/compile/css/main.min.css?version=" + version>

  </head>
  <body>

    <script type="text/javascript" src="/framework/compile/js/app.min.js?version=" + version></script>
    <script type="text/javascript" src="/framework/compile/js/app.min.js?version=" + version></script>

  </body>
</html>

以上显然是不正确的语法并且不起作用。

最佳答案

这是一个使用 Jquery 的快速解决方案:

<html>
  <head>
    
  </head>
  <body>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    
    <!--Your css and js will be referred inside this div -->
    <div id="updatable_source"></div>
    
    <!--Version updater script-->  
    <script>
      var version = '3.0'
      $('#updatable_source').html(
        '<link rel="stylesheet" type="text/css"'
          +'href="/framework/compile/css/main.min.css?version='+version+'"/>'
        +'<script type="text/javascript" src="/framework/compile/js/app.min.js'
          +'version='+version+'"/>'
        +'<script type="text/javascript" src="/framework/compile/js/app.min.js version='+version+'"/>'
      );
    </script>  
    
  </body>
</html>

只需更改“version”var 即可更新版本

关于javascript - 所有文件的版本控制后缀,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32053512/

相关文章:

javascript - 数据表打印复杂表头打印预览

javascript - js中如何获取事件对象的值

java - 使用JAVA将window.open(Hyperlink) Javascript代码转换为纯绝对url

html - CSS:将背景图像添加到:具有淡入淡出效果的伪元素之后

html - SVGforeignObject可以是HTML5吗

jquery - 带有图像的 div 标签的大小 - 带有 JQuery Mobile 的 html5

css - 避免重复 CSS 样式?

html - twitter-bootstrap - 导航栏元素有时会被推到导航栏下

css - Webkit 溢出滚动对齐元素

javascript - ng 模式允许在 Angular js 中输入字母数字但不带空格的输入标签