避免重复html代码——不要使用PHP

Avoid repeating html code- not using PHP

本文关键字：PHP 代码 html      更新时间：2024-05-28

我想这对一些人来说会很容易。为了避免在不同的页面上重复代码，我希望能够在不写出所有元素的情况下添加大块的html代码。有点像函数的页面控制器。

HTML1

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Test</title>
<!-- javascript/jQuery -->
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<div class="repeat-div"></div>
</head>
<body>
<script type="text/javascript" src="repeat.js"></script>
</body>
</html>

HTML 2

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Test</title>
<!-- javascript/jQuery -->
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<h1 class="repeat-div"></h1>
</head>
<body>
<script type="text/javascript" src="repeat.js"></script>
</body>
</html>

JS（repeat.JS）

$(document).ready(function(){
    $('.repeat-div').html("Hello");
});

Javascript并不理想，因为并非所有浏览器都支持Javascript，尽管它越来越流行。将服务器端代码与客户端代码分开总是一种很好的做法，除非绝对无法避免将两者结合在一起（随着jQuery和类似库的兴起，这种情况越来越常见）。

PHP包含不需要了解太多PHP，如果使用它们，也不必将每个文件重命名为.php。您可以将服务器（Apache上的.htaccess文件）配置为将所有.html文件处理为PHP。事实上，一旦网站启动，重命名单个端点通常不是一个好主意，因为这可能会导致链接到您的页面上的反向链接中断，搜索引擎会将重命名的页面视为新页面，除非您在旧端点位置指定永久重定向。您还可以将服务器配置为使用服务器端包含，而不是PHP包含。

尽管如此，如果你绝对想使用Javascript，你可以做一些类似的事情：

<script src='includeFile.js'></script>

在每个HTML文件中

然后在includeFile.js:中

document.write('
  <header>
    HEADER //Example header text
    //Additional header text
  </header>
');
相关文章：