导航条位于单独的html文件中，并在多个html文件/页面中使用

我创建了一个导航栏，希望在我网站的所有html页面上使用。我知道我可以使用jquery来执行此操作，但是如果我在本地运行它或需要在服务器上执行它，它将起作用吗？我正在使用以下脚本在我的head标签中获取jquery：

<script src=".4.1/jquery.min.js"></script>

下面是文件nav.html中的导航条形码

<ul>
<li><a href="index.html"> Home</a></li>
<li><a href="about_us.html">About Us</a></li> 
<li><a href="search.html">Trailblaze</a></li>
<li><a href="Parks.html">Parks</a></li>
<li><a href="Gallery.html">Gallery</a></li>

我计划使用以下js代码将其包含在html页面中

<body>
<div id="navigation"></div>
   <script>
        $.get("nav.html", function(data) {
        $("#navigation").replaceWith(data);
    });
   </script>
</body>

我不确定数据参数是什么。我希望nav.html的内容位于id =“ navigation”的位置。请指教。

回答如下：

jQuery Documentation中有一个确切的例子。

$.get( "ajax/test.html", function( data ) {
  $( ".result" ).html( data );
  alert( "Load was performed." );
});

此示例获取请求的HTML代码段并将其插入到页面中。

因此，在您的情况下，将是这样的（#navigation存在的理所当然）：

$.get("nav.html", function(data) {
    $("#navigation").html(data);
});

导航条位于单独的html文件中，并在多个html文件/页面中使用

我创建了一个导航栏，希望在我网站的所有html页面上使用。我知道我可以使用jquery来执行此操作，但是如果我在本地运行它或需要在服务器上执行它，它将起作用吗？我正在使用以下脚本在我的head标签中获取jquery：

<script src=".4.1/jquery.min.js"></script>

下面是文件nav.html中的导航条形码

<ul>
<li><a href="index.html"> Home</a></li>
<li><a href="about_us.html">About Us</a></li> 
<li><a href="search.html">Trailblaze</a></li>
<li><a href="Parks.html">Parks</a></li>
<li><a href="Gallery.html">Gallery</a></li>

我计划使用以下js代码将其包含在html页面中

<body>
<div id="navigation"></div>
   <script>
        $.get("nav.html", function(data) {
        $("#navigation").replaceWith(data);
    });
   </script>
</body>

我不确定数据参数是什么。我希望nav.html的内容位于id =“ navigation”的位置。请指教。

回答如下：

jQuery Documentation中有一个确切的例子。

$.get( "ajax/test.html", function( data ) {
  $( ".result" ).html( data );
  alert( "Load was performed." );
});

此示例获取请求的HTML代码段并将其插入到页面中。

因此，在您的情况下，将是这样的（#navigation存在的理所当然）：

$.get("nav.html", function(data) {
    $("#navigation").html(data);
});