Javascript 使用HTML和JS将HTML从一个文件导入到另一个文件？

我尝试了一些不同的解决方案，无论是在这里还是从网络上的各种来源，但似乎没有任何效果。 iframe似乎获取了我拥有的测试pdf文件，并使用它而不是html（我计划使用iframe pdf查看器）

jQuery和js脚本标记似乎没有效果

我使用的是新安装的Firefox，所以启用了js

im测试的方式是打开html文件，所以我需要以其他方式打开网页吗

我只是想在我所有的页面上都有我的标题和导航栏，而只需要更新一个文件。如果有人有任何其他的解决方案，我愿意尝试

提前感谢。

试试我找到的解决方案： 这将允许您使用jquery在当前html页面中包含另一个html页面

您还可以使用php include完成您试图实现的目标，但需要您的应用程序在web服务器上运行：

将此标签添加到页面正文中

请参阅：

到目前为止，我的解决方案是：

function renderImportContent() {
    //get template element and clone to clon
    var templateList = document.body.querySelectorAll("div[import]");
    //run throught the list and replace elements with templates
    for (var i = 0; i < templateList.length; i++) {
        //console.log(templateList[i].innerHTML);
        templateList[i].outerHTML = fetchTemplate(templateList[i].getAttribute("import"))
    }
}

function fetchTemplate(path) {
    console.log('/html/template/'.concat(path));
    fetch('/html/template/'.concat(path)).then((response) =>{ return response.text();}).then((html) => { document.body.innerHTML = html}).catch((error) => {console.log("fetch error:", err)});
}

函数renderImportContent（）{
//获取模板元素并克隆到克隆
var templateList=document.body.queryselectoral（“div[import]”）；
//运行列表并用模板替换元素
对于（var i=0；i{return response.text（）；}）.then（（html）=>{document.body.innerHTML=html}）.catch（（error）=>{console.log（“fetch error:，err）}）；
}

唯一的问题似乎是，它删除的内容超出了应有的范围。它不替换div标记的内部，而是替换整个主体

我也尝试过使用文本内容，但也没用