无缝加载技术加载到其他html跳转到其他界面的时候网址不发生变动这个怎么实现

要实现无缝加载技术（也称为Ajax加载），并在跳转到其他界面时保持网址不变，可以使用以下方法：

使用JavaScript的XMLHttpRequest对象或jQuery的Ajax方法发送异步请求，获取其他HTML页面的内容。
在当前页面中创建一个容器（如div），将获取到的其他HTML页面的内容插入到该容器中。
使用JavaScript的History API（如pushState或replaceState）或HTML5中的history.pushState()方法，修改浏览器的历史记录，但不会导致页面的实际跳转或刷新。
当用户点击链接或执行其他页面跳转操作时，阻止默认的页面跳转行为，而是使用上述方法加载其他HTML页面的内容到当前页面的容器中。

以下是一个简单的示例：

HTML代码：

<!DOCTYPE html>
<html>
<head>
  <title>无缝加载技术</title>
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  <script src="script.js"></script>
</head>
<body>
  <div id="content"></div>
  <a href="page2.html" class="ajax-link">页面2</a>
  <a href="page3.html" class="ajax-link">页面3</a>
</body>
</html>

JavaScript代码（script.js）：

$(document).ready(function() {
  // 监听所有带有.ajax-link类的链接的点击事件
  $('.ajax-link').click(function(e) {
    e.preventDefault(); // 阻止默认的页面跳转行为

    var url = $(this).attr('href');
    $.ajax({
      url: url,
      method: 'GET',
      success: function(response) {
        $('#content').html(response); // 将获取到的页面内容插入到容器中

        history.pushState(null, '', url); // 修改浏览器的历史记录
      }
    });
  });
});

在上述示例中，当用户点击带有.ajax-link类的链接时，会发送一个Ajax请求获取相应页面的内容，并将其插入到id为content的容器中。同时，使用history.pushState()方法修改浏览器的历史记录，但不会导致实际的页面跳转或刷新。这样，用户在点击浏览器的后退按钮时，可以返回到之前加载的页面