0

我习惯使用 ASP.NET 和 Visual Studio 来开发网站。我正在尝试以类似的方式开发一个普通的 .html 网站。我的意思是使用母版页等,因此可以重用代码,并且可能将这些模板文件部署到一组 .html 文件中。

例如

头.html

<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.ui.js" type="text/javascript"></script> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js">

header.html

<div data-role="header">
    <h1>Page Title</h1>
</div><!-- /header -->

页脚.html

<div data-role="footer">
    <h4>Page Footer</h4>
</div><!-- /footer -->

布局.html

<!DOCTYPE html> 
<html> 
<head> 
    <title>Page Title</title> 
        #include(head.html)
</script>
</head> 
<body> 

<div data-role="page">

    #include(header.html)

    #include_body()

    #include(footer.html)

</div><!-- /page -->
</body>
</html>

索引.html

<div data-role="content">   
    <p>Page content goes here.</p>      
</div><!-- /content -->

并将所有这些组合到一个输出文件中......

<!DOCTYPE html> 
<html> 
<head> 
    <title>Page Title</title> 

    <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head> 
<body> 

<div data-role="page">

    <div data-role="header">
        <h1>Page Title</h1>
    </div><!-- /header -->

    <div data-role="content">   
        <p>Page content goes here.</p>      
    </div><!-- /content -->

    <div data-role="footer">
        <h4>Page Footer</h4>
    </div><!-- /footer -->
</div><!-- /page -->

</body>
</html>

这样的事情存在吗?我不熟悉红宝石或任何东西......

4

2 回答 2

2

服务器端包含 (SSI) 可能会满足您的需求。满足一些基本的服务器要求后,您可以执行以下操作:

<!--#include virtual="includes/my_file.html" -->
于 2013-02-08T16:43:33.917 回答
1

您可以使用一点 PHP 来使用包含来执行此操作。

页眉、页脚等可以创建为新的 .php 文件,您可以在其中放置要在该部分中显示的所有内容。

然后,说你的 index.php 文件,你做类似的事情

<?php
    include ('header.php');
?>
<html>
    <head>
    </head>
    <body>
    </body>
<?php
    include ('footer.php');
?>

将包括页眉和页脚 PHP 文件中的所有内容。

于 2013-02-08T03:48:54.030 回答