将一个页面内容插入到html中的另一个页面

Question

<script src="jquery.js"></script> 
<header id="menu-header">

//menu bar

</header>

 <script> 
    $(function(){
      $("#menu-header").load("header.html"); 
    });
    </script> 

这里我想将标题菜单包含在不同的html页面中。如何在每个页面中包含一个html标题？我已经使用过jQuery load功能，但它在Chrome中无效。

//菜单栏

Answer 1

您可以使用jQuery获取请求。

例如，这里是menu.html文件

<ul>
    <li><a href="www.naveedramzan.com" title="Home">Home</a>
    <li><a href="www.naveedramzan.com/about-naveed" title="About">About</a>
</ul>

这是index.html档案

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<div id="menu"></div>
<script>
    $(document).ready(function(){
        $.get( "menu.html", function( data ) {
          $( "#menu" ).html( data );
        });
    });
</script>

jQuery将加载menu.html文件并在#menu中添加html，并且您可以在所有页面上执行

Answer 2

这个node.js库可以帮到你; templatesjs;