如何为所有其他 html 页面显示 HTML 相同的页面标题答案

【问题标题】：How to display HTML same page title for all other html pages如何为所有其他 html 页面显示 HTML 相同的页面标题
【发布时间】：2019-01-25 23:27:11
【问题描述】：

我想制作一些 HTML 页面，如果我在主页中更改了标题，则也需要在其他页面中进行更改。我怎样才能做到这一点？我应该使用模板继承吗？

我有 3 个不同的 html 页面

index.html
关于.html
联系人.html

现在如果我更改了 main.html 的标题，那么更改后的标题也必须反映在其他 3 个页面上。所以我不必每次都更改标题。

index.html

<!DOCTYPE html>
<html>
<head>
<title>My Title</title>
</head>
<body>

<h1>hello HTML</h1>
<p>learing HTML.</p>

</body>
</html>

关于.html

<!DOCTYPE html>
<html>
<head>
<title>My Title</title>
</head>
<body>
<h1>ABOUT ME</h1>
<h1>MY NAME IS TROJAN</h1>

</body>
</html>

和contact.html

<!DOCTYPE html>
<html>
<head>
<title>My Title</title>
</head>
<body>
<h1>contact ME</h1>
<h1>TROJAN@mymail.com</h1>

</body>
</html>

【问题讨论】：

标签： html css

【解决方案1】：

如果您确实需要坚持使用（静态）HTML 页面，您只能使用包含在所有 HTML 页面中的单个 javascript 文件来实现此功能。在该文件中，您可以设置标题：

document.title = 'This is our new title';

另一种选择是使用服务器端语言，如 PHP、ASP.NET、Java 等...

【讨论】：

【解决方案2】：

用户 jquery 或脚本可以在文档上添加页面标题

<script type="text/javascript">

    $(document).ready(function() {
        document.title = 'My Title';
    });

</script>

或者将您的 html 文件更改为 php 文件并为所有页面使用全局标题。

【讨论】：

我在 m main.js 文件中添加了这个不带脚本标签的内容，它可以工作！！
如果没有 jquery，这个解决方案将无法工作，并且当纯 js 完全没问题时，为页面标题添加像 jquery 这样的资源繁重的东西似乎是多余的.. reinder 的答案更好:)
这样你仍然需要更改所有文件的标题；它只是移动到 javascript。让您的示例使用外部 JS 文件，它应该可以工作

【解决方案3】：

使用 JS 你也可以在 html 元素中添加 id-"title"，它应该具有相同的内容，然后：

const variable = "some string"
document.getElementById('title').innerHTML = `Your title here is able to also contains some ${variable}`;

办公室。您需要在每个 file.html 中链接该 file.js

【讨论】：

【解决方案4】：

如果您使用纯 HTML，则必须更改每个文件的标题。您也可以使用 python 或任何其他脚本语言创建一个脚本来自动更改它，当然它的工作量更大，但如果您要开发很多网站，这是值得的。

【讨论】：

【解决方案5】：

您当然可以在 HTML 中执行此操作，但您应该在 PHP 中执行此操作。将文件名更改为 .php 而不是 .html 然后创建一个名为 title.php 的文件

在这个title.php文件中，你可以创建一个变量：

<?php
    $title = “cool title”;
?>

然后在 index.php 文件中的 <title> 标签中回显它：

<head>
   <title><?php echo $title;?></title>
</head>

您当然需要在索引页中包含此文件：

<?php include "title.php"; ?>

【讨论】：

我正在使用烧瓶 python
@ThisGuyHasTwoThumbs 显然只是一个语法错误。下次随时纠正。比发表评论花费更少的时间
@Niranjankulkarni 应该在您的问题中；这是非常重要的信息……您可以在任何服务器端语言中应用它。所有语言的答案都是一样的。只需创建一个变量并在您的标题标签中调用它
@ATomCalledStu 好的，我会试试的
@ThisGuyHasTwoThumbs 因为我忘记了我不需要 :)