是否可以使用 JavaScript 导入 HTML？答案

【问题标题】：Is it possible to import HTML using JavaScript?是否可以使用 JavaScript 导入 HTML？
【发布时间】：2011-01-27 16:17:20
【问题描述】：

我有一些页脚相同的 html 页面。使用 JavaScript 并且只有 JavaScript 可以在其中导入另一个 html 页面吗？

【问题讨论】：

标签： javascript html

【解决方案1】：

如上所述，一种方法是使用 jQuery 加载。我碰巧现在正在做完全相同的事情，所以将发布一个简单的示例。

使用 jQuery：

$("#yourDiv").load('readHtmlFromHere.html #readMe');

您的 readHtmlFromHere.html 页面将包括：

<div><div id="readMe"><p>I'm some text</p></div></div>

【讨论】：

什么是#yourDiv？那是主 html（又名 index.html）中所需位置的 id 吗？
这是注入 HTML 的 div 包装器。例如。 <div id='yourDiv'>HTML will be injected here.</div>.
用纯原生 JS（我的意思是，不使用 jQuery 或任何其他库）来做这件事怎么样？我实际上想先将一个 html 模板文件“导入”到一个变量中，这样我就可以在将其内容附加到一个 html 元素之前对其进行操作。

【解决方案2】：

以下是仅使用 javascript 为页面添加页脚的方法。

var ajax = new XMLHttpRequest();
ajax.open("GET", "footer.htm", false);
ajax.send();
document.body.innerHTML += ajax.responseText;

【讨论】：

【解决方案3】：

您可以使用 ajax 返回整个 HTML 页面。如果你想替换整个页面，你可以用 ajax 调用返回的 body 标签替换当前页面上的 body 标签和它的所有子标签。

如果您只想替换一个部分，则必须编写一个服务器端脚本来创建该部分，然后像上面一样使用 ajax，但只需替换一个元素而不是整个页面。

【讨论】：

【解决方案4】：

除了@Alex 提到的，jQuery 有一个方法.load()，您可以使用它来获取页面的特定部分（请参阅该页面上的加载页面片段标题）。您可以指定要检索的 URL 以及选择器（例如，如果您只需要特定的 <DIV> 的内容）。

【讨论】：

【解决方案5】：

您可以执行服务器端包含，具体取决于您的网络服务器。但最快的方法可能是创建一个使用 document.write 或类似的 JavaScript 文件来输出 html 语法。然后以正常方式包含创建的 JavaScipt 文件。更多信息： http://webdesign.about.com/od/ssi/a/aa052002a.htm

【讨论】：

【解决方案6】：

你当然可以，但如果你所做的只是模板，我建议你在服务器上这样做。

【讨论】：