This sounds like you are wanting to actually fetch the menu html from another location (even if on you local machine)

To achieve this you'll have to use the javascript fetch protocol. I would try something like this:

 <script>
  // Function to load the menu
  function loadMenu() {
    fetch("<path-on-your-machine-to-the-file>")
      .then((response) => response.text())
      .then((html) => {
        document.getElementById("nav-placeholder").innerHTML = html;
      })
      .catch((error) => {
        console.error("Error loading menu:", error);
      });
  }

  // Load the menu when the page finishes loading
  window.onload = loadMenu;
</script>

This will unblock your ability to fetch the html ... but it introduces another issue. If you are loading this page, as I suspect, in a modern (chrome based) browser it will likely block this request as it does not follow the CORS policy and looks like you are attempting to load resources from another origin.

To fix this you'll likely want to setup a simple web server running locally to serve your files. But to answer this I feel is beyond the scope of the original question.

Here are some tutorials node: - https://expressjs.com/en/starter/hello-world.html python: https://ryanblunden.com/create-a-http-server-with-one-command-thanks-to-python-29fcfdcd240e

Note: I have NOT tested these myself so please proceed with caution. The tutorials look helpful and not too dangerous.

Good luck and happy hacking.