Question

我想知道如何将标题（或任何html文件）添加到另一个html文件中。我尝试使用iframe，但它只是重定向了iframe内部的内容。一旦我完成了我的网站，我可能会有很多页面，所以能够添加一个只需更改一个文件即可更新的标题非常有用，而不必在所有页面上更改它。有谁知道如何做到这一点？提前谢谢。

Answer 1

使用jQuery：

<html>
    <head>
        <script src="jquery.js"></script>
        <script>
            $(function(){
                $("#includedContent").load("b.html");
            });
        </script>
    </head>
    <body>
    <div id="includedContent"></div>
    </body>
</html>

使用不带jQuery的JavaScript：

<html>
    <body>
        <script src="b.js"></script>
    </body>
</html>

b.js：

document.write('\
\
    <h1>This is my include file</h1>\
\
');

使用PHP：

<?php include('b.html');?>

为此，您可能需要修改Web服务器上的.htaccess文件，以便在.html文件中解析php。您应该在.htaccess文件中看到或添加此内容：

RemoveHandler.html
AddType application/x-httpd-php .php .html

使用服务端包含（SSI）：

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

使用HTML5：

<object name="foo" type="text/html" data="foo.inc"></object>

可替换地：

<embed type="text/html" src="foo.inc">

Answer 2

我搜索过没有javascript方式，但我无法使其工作。这是包含HTML的最简单方法

您可以为页眉，页脚，内容以及您想要在单独文件中创建的任何内容创建html文件，而您需要做的就是：

1.在您的页面中输入

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

您也可以下载w3.js并将其上传到您的服务器文件

<script src="/lib/w3.js"></script>

2.然后，您希望将html代码从单独的文件中包含在您的页面中：

<div w3-include-html="header.html"></div>

例如

<a href="google.com">Google</a> 
<div w3-include-html="footer.html"></div>
<h1>Title of current page</h1>
<div w3-include-html="content.html"></div>

在前一个“包含”代码
之后的任何地方包含下一个代码
```
<script>w3.includeHTML();</script>
```

来源w3schools.com How TO - Include HTML

这就是它的外观

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

如何为所有html页面添加标题（最好没有javascript）

2 个答案: