相当于 HTML 中的 include()

发布于 2024-09-27 12:25:23 字数 223 浏览 4 评论 0原文

我想知道是否有一种方法可以仅使用 html 将一些 html 内容包含在另一个 html 中？

PHP 的替代品

<?php include("file.php"); ?>

这可能吗？

编辑：

这引起了一些混乱，我需要的是“几乎是一个 html 标签”，它具有在另一个文档中包含 html 文档的功能。

原文

I was wondering wether there is a way to include some html content inside another html using only html?

A replacement to PHP's

<?php include("file.php"); ?>

Is this possible?

EDIT:

This has brought up some confusion, what I needed was "almost an html tag" that had the functionality of including a html document in another.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

温馨耳语 2024-10-04 12:25:23

你有没有尝试过：

<object type="text/html" data="file.html"></object>

Have you tried:

<object type="text/html" data="file.html"></object>

回复收藏 0 原文

糖果控 2024-10-04 12:25:23

它不能纯粹通过 HTML 来完成。（但是，有 iframe，但我认为这不符合这种情况。）

可以使用 JavaScript 来完成。您可以通过 Ajax 获取另一个文件，并将其内容放置在当前页面上的 HTML 元素内。

回复收藏 0 原文

心的憧憬 2024-10-04 12:25:23

我写的一个库的无耻插件解决了这个问题。

https://github.com/LexmarkWeb/csi.js

<div data-include="/path/to/include.html"></div>

以上将采用 /path/ 的内容到/include.html并用它替换div。

Shameless plug of a library that I wrote the solve this.

https://github.com/LexmarkWeb/csi.js

<div data-include="/path/to/include.html"></div>

The above will take the contents of /path/to/include.html and replace the div with it.

回复收藏 0 原文

神也荒唐 2024-10-04 12:25:23

HTML 本身不具备包含附加内容的功能。然而，大多数 Web 服务器确实有服务器端包含语句：
Apache 中的 SSI

IIS 中的 SSI

回复收藏 0 原文

鸠书 2024-10-04 12:25:23

唯一的就是一个纯 html 的 iframe。但你也可以使用 javascript 通过 ajax 获取页面并将其包含到你的 dom 层次结构中

回复收藏 0 原文

遥远的绿洲 2024-10-04 12:25:23

是的，但是您需要在配置或 .htaccess 中启用它：

Options +Includes
AddType text/html .shtml
AddHandler server-parsed .shtml

当然，您需要将执行包含操作的任何文件重命名为 .shtml...或者您可以使用：

Options +Includes
AddType text/html .html
AddHandler server-parsed .html

语法本身类似于评论：

<!--#include virtual="/footer.html" -->

Yes there is but you need to enable it in your config or .htaccess:

Options +Includes
AddType text/html .shtml
AddHandler server-parsed .shtml

Of course with that youd need to rename any file doing the including to .shtml... or you could jsut use:

Options +Includes
AddType text/html .html
AddHandler server-parsed .html

the syntax itself is similar to comment:

<!--#include virtual="/footer.html" -->

回复收藏 0 原文

删除→记忆 2024-10-04 12:25:23

没有这样的事。您必须使用服务器端脚本语言或 JavaScript 来执行此类操作。

回复收藏 0 原文

ゝ偶尔ゞ 2024-10-04 12:25:23

如果您使用 Apache，可以尝试服务器端包含。

回复收藏 0 原文

自由范儿 2024-10-04 12:25:23

这可能晚了几年，但我就是这么做的！

在放置此行之后的第一行！

<SCRIPT LANGUAGE="JavaScript" src="http://yourdomain.com/header.js">

然后创建一个名为“header.js”的文件并输入您要包含的文件的内容！
像这样......

<!-- Begin
document.write('<center>');
document.write('<a href="http://alinktosomewhere.co.za">a link 1</a>');
document.write('<a href="http://alinktosomewhere.co.za">a link 1</a>');
document.write('<a href="http://alinktosomewhere.co.za">a link 1</a>');
document.write('<a href="http://alinktosomewhere.co.za">a link 1</a>');
document.write('<hr>');
document.write('</center>');
// End -->

希望这有帮助！

This might be a few years late but this is how i did it !

in the first line after put this line !

<SCRIPT LANGUAGE="JavaScript" src="http://yourdomain.com/header.js">

then create a file called "header.js" and enter the content of the file you want to include !
like so....

<!-- Begin
document.write('<center>');
document.write('<a href="http://alinktosomewhere.co.za">a link 1</a>');
document.write('<a href="http://alinktosomewhere.co.za">a link 1</a>');
document.write('<a href="http://alinktosomewhere.co.za">a link 1</a>');
document.write('<a href="http://alinktosomewhere.co.za">a link 1</a>');
document.write('<hr>');
document.write('</center>');
// End -->

Hope this help !

回复收藏 0 原文

噩梦成真你也成魔 2024-10-04 12:25:23

差不多10年过去了，有些人可能仍然对此存有疑问。因此，我将解释 2020 年我们今天拥有的一个简单解决方案。

我总是使用 jquery .load() 函数，并且从未遇到过问题。

Exemple: ( "#content" ).load( "includes/menu.html" );

Almost 10 years later, some people may still have doubts about this. So I'm going to explain a simple solution that we have today in 2020.

I always use the jquery .load() function and never had a problem with that.

Exemple: ( "#content" ).load( "includes/menu.html" );

回复收藏 0 原文

も让我眼熟你 2024-10-04 12:25:23

Html 中缺少 Include\Import 确实令人沮丧！

一个好的替代方案是“服务器端包含 (SSI)”，以防“PHP”不受支持！

几乎所有（如果不是全部）Web 主机服务器都支持 SSI！

<!--#include virtual="layout.html" -->

包含上述行的文件必须以“.shtml”或“.shtm”扩展名结尾！

浏览器本身无法执行像 Include\Import 这样简单的操作，这真的很烦人！

与 php 或 Node.js 一样，任何浏览器都应该支持在 HTML 加载过程开始之前使用 Javascript 本身对 html 进行预处理！

The lack of Include\Import in Html is really frustrating!

A good alternative is "Server Side Includes (SSI)" in case "PHP" is not supported!

SSI is supported by almost any (if not all) web host server!

<!--#include virtual="layout.html" -->

The file that contains the above line must end with ".shtml" or ".shtm" extensions!

It's really annoying that something as easy as Include\Import can't be performed by the browser itself!

Like php or Node.js, preprocessing the html using Javascript itself before the HTML Load process start should be supported in any browser!

回复收藏 0 原文

快乐很简单 2024-10-04 12:25:23

现在到了 2022 年，我使用 Vanilla Javascript fetch()。

这是如何包含
文件：“newfile.html”进入
div：“容器”

// HTML
<div id="container"></div>


// JS
const loadHtmlFile = (fileName, containerId) => {
  fetch(fileName).then(function (response) {
    return response.text();
  }).then(function (html) {
    containerId.innerHTML = html;
  }).catch(function (err) {
    console.warn('Something went wrong.', err);
  });
}

loadHtmlFile("newfile.html", container)

Now in 2022 I use Vanilla Javascript fetch().

This is how to include
file: "newfile.html" into
div: "container"

// HTML
<div id="container"></div>


// JS
const loadHtmlFile = (fileName, containerId) => {
  fetch(fileName).then(function (response) {
    return response.text();
  }).then(function (html) {
    containerId.innerHTML = html;
  }).catch(function (err) {
    console.warn('Something went wrong.', err);
  });
}

loadHtmlFile("newfile.html", container)

回复收藏 0 原文

~没有更多了~