Javascript 如果我有一个跨多个HTML文件通用的HTML部分，我可以将它放在自己的.HTML文件中吗？

标题可能有点混乱，抱歉。让我澄清一下

所以在我的网站上，我有一个

部分，它出现在网站的每个.html页面上。如果我想更改导航菜单，我必须在每一页上更改它

有没有一种方法可以将

部分放在自己的.html文件（例如nav.html）中，然后在每个site.html页面上生成它？这样，如果我需要进行更改，那么只需要在单个文件（即nav.html）中进行更改，并且在运行时仍会在所有页面上进行更新

如果我能以某种方式做到这一点，我如何使其在按下当前页面的导航按钮时滚动到页面顶部

因此，如果我在photos.html上，单击导航栏上的“photos”链接（通常会将我带到photos.html），我可以让它不刷新页面，而是直接转到顶部吗？（即

）

有没有一种方法可以将该部分放在自己的.html中 文件（例如nav.html），然后在每个站点上生成它 页面

您可以将

.load（）

或

$.get（）

与

.append（）

或

.prepend（）

一起使用

---

为了使导航栏只包含在一个文件中，jquery的

.load

或

.get

函数将是最简单的解决方案，如guest271314答案中所述。虽然我会做一些类似的事情来加载内容：

$(document).ready(function() {
    $('#nav-container').load('nav.html');
});

我意识到这意味着你需要在每一页上添加

，但对我来说这似乎是一个更干净的解决方案

对于页面跳转，您只需在href中使用

id

，就像这样。这将使页面滚动到div的顶部，并在

href

中输入

id

<div id="pictures"></div>
<a href="#pictures">Pictures</a>

---

我将创建一个名为navMenu.php的include文件，其中包含您的nav菜单代码

<nav> menu code here </nav>

这里的菜单代码

然后，将要包含此代码的每个页面重命名为扩展名.php
然后，在这些其他页面中的任何地方，您都可以写入导航菜单代码

<?php require 'navMenu.php' ?>

---

请参阅：

我认为这将对您有所帮助（问题的第一部分）@Visrozar确实有帮助，谢谢。但是，如果我的nav.html使用JavaScript之类的东西，那么当我加载到nav div中时，JS不会加载。我如何才能使JavaScript也能工作呢？谢谢。如何让JavaScript在nav.html页面上工作？有一些JavaScript可以与菜单导航栏一起使用，但当我使用

$（“#nav”）.load（“nav.html”）时，它就不起作用了。导航栏的html加载良好，但JavaScript不起作用。有什么办法让它工作吗？感谢我对来宾271314回答的评论。您的html页面中似乎没有包含jQuery。谢谢。如何让JavaScript在nav.html页面上工作？有一些JavaScript可以与菜单导航栏一起使用，但当我使用
$（“#nav”）.load（“nav.html”）时，它就不起作用了。导航栏的html加载良好，但JavaScript不起作用。有什么办法让它工作吗？谢谢你为什么在
html
文件中包含
javascript
？不，我的意思是，例如，我有一个main.js文件，其中包含导航栏的js，在index.html文件中有
。但是当我做
$（“#nav”）.load（“nav.html”），导航栏的JavaScript不起作用，
main.js
与问题有什么关系？您可以创建一个plnkr来演示吗？您必须确保在脚本中包含jQuery
并确保在
main.js
之前包含此代码。正如@guest271314所说，如果没有所有的代码或工作示例，很难告诉您什么是错误的。虽然这是我的首选语言，但这个答案并不能回答OPs问题。PHP甚至不在问题的标签中。
<nav> menu code here </nav>

<?php require 'navMenu.php' ?>