Including another HTML file in an HTML file
In this article we will learn the ways we have to include another HTML file in an HTML file, to be able to reuse files in a simple way
Hey you all programmers, how are you? Let’s learn the ways to include an HTML file in another HTML!
First, it is good to clarify that there is no native way to do this in the HTML itself.
That is, we will need other tools that will do this HTML file insertion in the other
So let’s see some of them:
Include by Apache
If you are using a web server in your application, such as Apache
It is possible to create an instruction that will insert a file into another
Let’s take a look:
<!-- #include file="file.html" -->
With the jQuery library it is also possible to easily add an HTML to the page
See the instruction:
$( "#element" ).load( "file.html" );
Through the load method, we load an HTML file into another HTML
You can also opt for frameworks that use components such as: React, Vue and Angular
So you can add the HTMLs only when needed, on the page you want
The concept of Single Page Applications (SPA) has become increasingly present in the web world.
Of course, here the learning curve is much higher, and you may need to change your project completely
If you need a quick solution use the two methods mentioned first, and then learn this variation with SPA
In this article we learned how to include another HTML file in an HTML file
We use several ways, such as native Apache, jQuery and modern front-end frameworks
It is also important to point out that there is no native way to complete this action with pure HTML
Do you want to learn more about HTML? Click here!