Question

我从Jade切换到基本HTML并遇到以下问题：

如何为我的整个网站（一个文件）提供一个导航菜单？

在Jade我做了以下事情：

我的菜单位于default.jade：

body
    .header-site
        h1.page-title Christopher Kadé

    ul.nav-site
        li: a(href='/') About me
        li: a(href='/projects') Projects
        li: a(href='/contact') Contact

    .main-content
        block content

并在每个其他default.jade文件中包含.jade，并将其内容写入block content。这样，我的网站上就有我的标题和菜单。

但我似乎无法弄清楚旧的HTML中的等效方法。

Answer 1

要在整个网站中使用相同的导航菜单，您可以使用php或javascript。使用php -

<?php
include_once 'navigation.php';
?>

使用javascript

<div  id="navigation">
</div>

<script>
$("#navigation").load("navigation.html");
</script>

Answer 2

您需要服务器端包含（使用服务器端语言） - HTML本身不支持此功能。或者如果使用jQuery：

<html> 
  <head> 
    <script src="jquery.js"></script> 
    <script> 
    $(function(){
      $("#nycontent").load("header.html"); 
    });
    </script> 
  </head> 

  <body> 
     <div id="mycontent"></div>
  </body> 
</html>

header.html
<h1>test</h1>

或者，用普通的旧JS：

<html>


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

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

每页的一个导航菜单

2 个答案: