将一个 HTML 文件加载到另一个答案

【问题标题】：load one HTML file into another将一个 HTML 文件加载到另一个
【发布时间】：2017-08-18 03:27:27
【问题描述】：

我正在尝试将一个 HTML 文件加载到另一个中。

index.html

<!DOCTYPE html>
<html>
    <body>
        <div id="default"></div>
        <script src="index.js"></script>
    </body>
</html>

我发现这个 js 代码可以使用，但不是使用按钮单击，我希望读取文件并将其传递给 innerHTML onload

index.js

window.onload = function() {
        var fileInput = document.getElementById('fileInput');
        var fileDisplayArea = document.getElementById('fileDisplayArea');

        fileInput.addEventListener('change', function(e) {
            var file = fileInput.files[0];
            var textType = /text.*/;

            if (file.type.match(textType)) {
                var reader = new FileReader();

                reader.onload = function(e) {
                    fileDisplayArea.innerText = reader.result;
                }

                reader.readAsText(file);    
            } else {
                fileDisplayArea.innerText = "File not supported!"
            }
        });
}

谢谢，这里还需要window.onload = function()吗？

【问题讨论】：

我不想使用 jquery
我怎么能像上面的例子一样使用 javascript FileReader 来做到这一点。在上面的示例代码中，我唯一需要更改的是，我希望直接从指定的文件夹/目录中读取文件，而不是使用输入单击来上传文件！我更喜欢使用 javascript，以便我可以进行后端编码以动态修改所有内容。
与Include another HTML file in a HTML file重复
这能回答你的问题吗？ Include another HTML file in a HTML file

标签： javascript html innerhtml filereader

【解决方案1】：

在 html 中，您可以使用 iframe 将其他 html 文件加载到一个 html 文件中

<!DOCTYPE html>
<html>
<body>

<iframe src="header.html">
  <p> display</p>
</iframe>

</body>
</html>

或者您可以参考这些社区链接

How to include an HTML page into another HTML page without frame/iframe?

Insert one HTML file into another HTML file

没有 iframe 试试这个为您的 div 提供 id

 document.getElementById("your div id").innerHTML='<object type="text/html" data="home.html" ></object>';

【讨论】：

真的不想使用 iframe，而只想处理标准的 javascript