We're going to give the user the option to load data from other HTML files. This gives us the ability to provide them with requested data on demand.
Start by creating two HTML documents that will serve as our remote HTML data. Save them as
htmlremote1.html
andhtmlremote2.html
. Place some sample HTML markup to help you determine which file is being loaded. Here is what I used forhtmlremote1.html:
<p>This is data from <strong>htmlremote1.html</strong></p>
Next, create a new HTML document that will be our web page that loads the two HTML documents. Name it anything you like, but save it in the same location as the two other HTML files.
In our HTML document, we will add two
<a>
elements that will serve as means for the user to request the data they want. We also create a div element with an ID ofload-area
that will contain the HTML that we retrieve.<a id="load-htmlremote1" href="#">Load content from htmlremote1.html</a...