Partials in static website as Components. How to include HTML ?

We have always been relayed on libraries like handlebars for creating static component and separating code through partials.

I was working on my portfolio website https://www.harish.website/ and come across research and trying solution with small snippet, i could achieve it easily.

Here is the solution:
1. Create importHTML.js file with below snippet.

2. Create components by separating common HTML in my case header.html , nav.html, footer.html

3. Call Created importHTML.js in HTML file in my case index.html file call script file created above
<script src=”js/htmlImport.js”></script>

3. Invoke function from htmlImport.js in the end of HTML file
<script> includeHTML(); </script>

PS. We can also use working draft features like HTML import and web components
https://developer.mozilla.org/en-US/docs/Web/Web_Components/HTML_Imports
https://developers.google.com/web/fundamentals/web-components/customelements

Conclusion:
Even when we are creating static websites we can use these compatible technic to separate content by creating component as partial and import in all pages so, Common content can be easily replaced from single component.

References: https://www.w3schools.com/howto/howto_html_include.asp