Html 避免网站中的代码重复

我将创建一个网页，有一个侧边栏，侧边栏将有链接到其他网页和东西。按照我的编码方式，对于侧边栏上的每个链接，我都有另一个HTML文档。侧边栏链接到另一个.html文件，该文件包含网站模板/布局，您可以随意调用它。因此，我有一个index.html作为主页，然后是about.html等。对于每个html文档，该文件包含整个网站布局的代码（边栏、页脚等）。因此，在侧边栏链接到的不同链接之间，唯一的区别是内容。因此，如果我想更改我的网页布局（例如侧边栏的颜色），我必须转到每个HTML文档并更改它

---

所以我的问题是人们应该怎么做？我认为我做得不对。你只需要有一个包含模板的文件吗？

你应该看看哪个文件允许你有一个用于标题的文件，另一个用于侧边栏的文件和所有其他在所有页面上都相同的文件。然后您只需在index.php，about.php中使用它。

将所有样式保存在外部CSS样式表中，该样式表在每个html页面的头部引用。然后，可以在一个位置更改样式。这是更改侧边栏颜色的示例

---

如果您想在每个页面上为侧边栏保持一致的html结构，请使用php。您将创建一个名为sidebar.php的文件，并使用

include

方法将相同的代码导入每个页面。如果以后要更改它，请编辑single sidebar.php文件，其他所有文件都将导入新代码。

对此有很多答案。最典型的是使用服务器端语言对HTML进行预处理。这样，您就可以拥有一个总体布局文件和单独的“视图”。视图只包含每个页面的唯一内容，布局包含基本不变的包装。然后，您可以根据需要将这两个部分组合在一起，而无需重复代码

---

学习您感兴趣的任何服务器端语言，从PHP over Ruby到Python或*.NET。

对我来说，解决这个问题的方法是用一种叫做PHP的语言编写一点服务器端脚本。我创建header.php、footer.php，在您的例子中，我还将创建一个sidebar.php文件

那么什么是PHP？这是一种脚本语言，非常有用。在您的情况下，它并没有那么重要，但是您可以使用它做一件非常方便的事情—包括其他文件。您的web服务器必须安装并运行PHP。您还可以使用一个名为Xampp的免费工具在本地PC上运行它

所以当我开始时，我会创建一个名为index.php的文件。在这个文件中，我会像往常一样从一个head部分开始。包括您的CSS（您正在制作CSS文件，对吗？这比样式部分好得多-您可以重复使用相同的样式表，它还有一些其他好处。）并设置任何脚本（如果您正在使用它们）。在正文中，您将使用一个特殊的PHP标记来运行一点PHP代码：

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

这将“包括”名为header.php的文件。当你加载它的时候，你放在那里的任何东西现在都是这个文档的一部分。它可以是纯PHP、HTML甚至纯文本。使用它来设置标题。在页脚所在的页面底部，使用更多的PHP：

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

在footer.php中，您猜对了-输入您的页脚代码。然后关闭body标记和html标记。您还可以使用相同的技术包括侧边栏。我建议您在包含的文件中打开的任何HTML标记也在同一文件中关闭。这将使您更容易管理页面的各个部分

这是使用PHP可以做的最简单的事情，但对于制作站点的可重用部分来说，这是一种非常方便的技术。一旦掌握了它，您将节省大量的时间和精力。

Moneydev

你要找的是一个模板系统。如果你想坚持使用纯HTML，你必须使用外部工具来帮助你，因为它没有内置的模板。Dreamweaver能够允许您在网页内定义区域，以表明它们是相同的区域，并在整个网站中“作为一个”进行维护

不过，它的工作方式实际上是相当低的技术含量。它所做的是搜索Dreamweaver管理的网站中的所有文件，并在您从“主位置”编辑该部分时“搜索并替换”该部分，这是在您首先设置该部分时确定的

AliHamze建议在PHP项目中使用“包含”。这是PHP常用的方法，但我有偏见，更喜欢ASP.NET的答案而不是模板。它是“.master”（页面）和“.ascx”（控件）的组合，允许您以嵌套方式对它们进行模板化和重用。这远远超出了简单的“搜索和替换”（由Dreamweaver使用HTML完成），但需要您学习一个新的开发环境

因此，归根结底，你可以坚持使用HTML，这将更加简单，让你能够专注于学习HTML/CSS和JavaScript。这是伟大的建立一个发展的基础…然而，要真正进入“大联盟”，我建议选择IDE

作为一个长期使用Windows的人，我非常喜欢通过Microsoft Visual Studio使用ASP.NET和Microsoft SQL数据库。也就是说，我是那种可以喝可口可乐，但仍然喜欢百事可乐的人。如果您想研究PHP或Java，这些也是很好的选择。如果我想要一个自由而强大的IDE，让我的web开发生活有一个健康的开始，我会去以下几个地方：

ASP.NET（Microsoft Visual Studio）--阅读模板制作的“母版页”和“控制文件” （对于数据库，我更喜欢使用Microsoft SQL（可以使用Express Edition），不过如果您愿意，也可以使用mySQL）

PHP（EclipseIDEforPHP）——查看模板的“includes”

Java（EclipseIDE）