如何在HTML页面中包含HTML侧边栏？

我已将我的页面的侧边栏写入HTML文件。我想在我的所有HTML页面中包含相同的侧边栏。如何将侧栏HTML文件包含到我的Dashboard.html文件中，以便侧栏可见？如何在HTML页面中包含HTML侧边栏？

如果不可能，请您提供备用解决方案吗？

2016-10-18 Rose

看看这里：HTTP：//计算器。 com/questions/8988855/include-another-html-file-in-a-html-file也许它会帮助你 – Arkej

看看这个教程，这可能会帮助你 - http://www.w3schools.com/howto/howto_html_include .asp – yashpandey

@Arkej感谢您的链接。我早先检查过它，尝试了那里的建议。没有帮助。 – Rose

您无法将HTML页面直接包含在另一个HTML内。但是我们可以通过使用Jquery Load函数来实现这一点。见例如，

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

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

来源

2016-10-18 11:41:32

我在我的页面中使用了Thymeleaf。使用这将在dashboard.html文件中为行提供“Uncaught SyntaxError：意外标识符”。 – Rose

可以在角JS使用的角度指令做到这一点，如图中保存.html文件侧边栏

假设你身边吧dashboard.html

<ul> 
    <li><a> Home</a></li> 
    <li><a> About</a></li> 
    <li><a> Contact</a></li> 
    <li><a> Careers</a></li> 
</ul>

ngInclude

<div ng-include="'dashboard.html'"></div>

来源

2016-10-18 11:46:05 Surendra

试了一下。侧边栏没有出现。但是也没有得到任何错误。什么可能是这个问题？ – Rose

您需要在指数angularjs，HTML – Surendra

您可以检查此链接 http://www.w3schools.com/angular/tryit.asp?filename=try_ng_include – Surendra

有几种方法可以这样做。我推荐使用JQuery：

假设您在sidebar.html文件中有侧边栏的html代码。

然后，在任何你想包括HTML文件，你应该创建一个div包含它和它加载sidbar.html内容：

<html> 
    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <!-- ...or whereever you have jquery stored --> 
    <script> 
    $(function(){ 
     $("#sidebar").load("sidebar.html"); 
    }); 
    </script> 
    </head> 

    <body> 
    <!-- other content here --> 
    <div id="sidebar"></div> 
    <!-- other content here --> 
    </body> 
</html>

来源

2016-10-18 11:47:35 MarcM

这个建议和Vinod的一样。请检查我的评论。 – Rose

Thymeleaf的语法错误问题与html include技术无关。仔细检查你的代码。或与我们分享，以便我们可以看看。 – MarcM

如何在HTML页面中包含HTML侧边栏？

回答

相关问题