Question

所以我尝试使用w3中的脚本在我网站上的所有网页上实现一个菜单（header.html）。

当我从USB记忆棒运行时，脚本在我的Windows PC上完全正常工作。但是，如果我尝试从我的Mac上的USB-Stick启动网站，它就不再起作用了。当我将网页上传到网络服务器时，它无法在Win或Mac上运行。有没有简单的修复或我需要安装Node.js？（据我所知，Javascript是Client-Sided，它应该适用于所有启用了Javascript的浏览器）

示例HTML文件：

  <title>Sample</title>
  <meta charset='utf-8'>
  <link rel="stylesheet" href="css/main.css">
  <link rel="icon" type="favicon.ico" href="icon.ico">
</head>
<body>
  <div id='website'>

    <div id='main'>

      <!-- Including the Header using a script -->
      <div w3-include-html="header.html"></div>
      <script src="w3-include-HTML.js" type="text/javascript"></script>

      <div id='contmain'>
        <span id='page_title'> Videos</span>      
        <div id='center_text'>   
          <b>Video 1</b>               
          <iframe width="640" height="360" src="//www.youtube.com/" frameborder="0" allowfullscreen></iframe>
        </div>
        <br>
        <div id='center_text'>      
          <b>Video 2</b>
          <iframe width="640" height="360" src="//www.youtube.com/" frameborder="0" allowfullscreen></iframe>
        </div>           
      </div>

      <div id='contmain'>
        <div id='center_text'>
          <b>Video 3</b>  <br>
          <iframe width="640" height="360" src="//www.youtube.com/" frameborder="0" allowfullscreen></iframe>
        </div>
      </div>
    </div>

  </div>
  <div class="foulard"></div>
  <div class="logophoto"></div>

</body>
</html>

Javascript：

(function () {

myHTMLInclude();

function myHTMLInclude() {
  var z, i, a, file, xhttp;
  z = document.getElementsByTagName("*");
  for (i = 0; i < z.length; i++) {
    if (z[i].getAttribute("w3-include-html")) {
      a = z[i].cloneNode(false);
      file = z[i].getAttribute("w3-include-html");
      var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
          a.removeAttribute("w3-include-html");
          a.innerHTML = xhttp.responseText;
          z[i].parentNode.replaceChild(a, z[i]);
          myHTMLInclude();
        }
      }      
      xhttp.open("GET", file, true);
      xhttp.send();
      return;
    }
  }
}

})();

Answer 1

Windows上的文件系统不区分小写和大写文件名，因此在您的情况下，“w3-include-HTML.js”将等于“w3-include-html.js”。

在大多数网络服务器（主要是Linux）和Mac OS系统上，您必须注意大小写文件名。

这解释了为什么它在Windows上运行，但不适用于Mac OS或在您的网络服务器

Javascript在Windows上本地工作，但不在Web服务器上

1 个答案: