首页 > 解决方案 > 如何在当前 html 代码中使用外部 html 文件

问题描述

我正在尝试将外部 HTML 页面(通用导航)加载到我当前的 HTML 页面中。我尝试了加载功能,但它已被弃用。你能告诉我另一种包含它的方法吗?我没有使用任何服务器。

这是我的代码

<!DOCTYPE html>
<html>

<head>
  <script src="ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script>
    $(document).ready(function() {
      $('#content').load(" nav.html ");
    });
  </script>
</head>

<body>
  <div id="content "></div>
</body>

</html>

标签: javascriptjqueryhtml

解决方案


尝试这个

<script>
    function loadPage(href) {
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.open("GET", href, false);
        xmlhttp.send();
        return xmlhttp.responseText;
    };

    document.getElementById('content').innerHTML =
        loadPage('your_html_file.html');
</script>


<div id="content">

</div>

推荐阅读