导入HTML文件后无法加载横幅

我从网络服务下载的网站顶部有一个图片横幅。我有一个header.html和一个home.html文件，为了便于编辑，我将header.html代码导入到home.html文件中。当我运行header.html时，横幅完美运行，但是当我运行home.html时，它不会。当我检查元素时，为横幅分配了空间，但没有内容。导入HTML文件后无法加载横幅

家用代码

<html> 
<head> 

    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <title>Saisentan Music</title> 
    <meta name="home page" content="Epic Orchestral Music by Taylor Barton"> 
    <link rel="stylesheet" href="style.css"> 

</head> 

<body> 

    <script src="https://www.w3schools.com/lib/w3.js"></script> 
    <div w3-include-html="header.html"></div> 
    <script>w3.includeHTML();</script> 

    HOME 


</body>

生病把头部代码在下面的链接，因为它很长，难以阅读（感谢计算机生成的代码）。在同一份文件都home.html的和header.html中的截图

https://docs.google.com/document/d/1hWNrjLP11FvTJQgBPa19_NmVn1d5nTr-k1dhqdVwcE0/edit?usp=sharing

来源

2017-08-01 Taylor Barton

里面的功能您正在调用，w3.includeHTML查看页面上的所有标签，找到属性为w3-include-html的人，尝试获取该文件，并将该文件作为innerHTML插入。脚本不执行。

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

您需要调用这些脚本。 This question might help

来源

2017-08-01 16:49:09

我敢肯定这是问题...问题是，我不是很好的JavaScript（这就是为什么我借用代码....）所以你有什么想法如何调用脚本？我读了另一个答案，但它有点像我的头 –

如果我使用jquery或类似的东西会自动调用代码吗？ –

是的，这很公平。最简单的解决方案是将滑块代码保存为JavaScript文件'slider.js'。在每个页面中，您可以使用包含'w3.js'代码的相同方式包含滑块代码：''。 [见这里]（https://stackoverflow.com/questions/16677095/what-is-the-right-way-to-write-my-script-src-url-for-a-local-development-envir） –

尝试把这个代码

<script src="https://www.w3schools.com/lib/w3.js"></script>

你的身体之前或head标签

来源

2017-08-01 16:48:50

不幸的是，这些想法都没有奏效。虽然谢谢！ –

您是否在使用Google Chrome浏览器并打开您的文件，如下所示：//home.html？ –

是的....它实际上运行通过一个wamp服务器 –

看过Sven的冲浪者回答（见下文）后，我意识到我的脚本没有运行。我用来导入html的js没有运行脚本，所以我改为使用Iframe标记导入我的横幅代码，并且它完美地工作。

来源

2017-08-01 17:38:53

导入HTML文件后无法加载横幅

回答

相关问题