The header and footer of this page are loaded dynamically using Ajax. Find out more here.
The body element of this page has been given an HTML data attribute named data-ajax-text-files that specifies the space-delimited paths to header.txt and footer.txt.
These files contain the HTML markup for the header and footer of this page.
The data-ajax-text-files attribute must be placed on the body element.
<body data-ajax-text-files="header.txt footer.txt"></body>
Suitable container elements have each been given a data attribute named data-ajax-text-file that specifies the path to one of the files.
This indicates that the content of the file at the specified path should be appended to the inner HTML of the container element.
In this case, the header and footer are inserted into table elements at the top and bottom of the page, respectively.
<body data-ajax-text-files="header.txt footer.txt">
<table data-ajax-text-file="header.txt"></table>
...
<table data-ajax-text-file="footer.txt"></table>
</body>
When appropriate, the asynchronous function Ajax_Document_StartText(<callback>) is called.
This function
data-ajax-text-files dynamically,
data-ajax-text-file attribute, and
In this case, the function is called via the window.onload global event handler, and the callback function prints a simple message to the console.
<body data-ajax-text-files="header.txt footer.txt"
onload="Ajax_Document_StartText(function () {
console.log('Hello, World!');
});">
<table data-ajax-text-file="header.txt"></table>
...
<table data-ajax-text-file="footer.txt"></table>
</body>
This framework can also be used to retrieve tags from XML files using the analogous data-ajax-xml-files, data-ajax-xml-file and data-ajax-xml-tag attributes, and the asynchronous Ajax_Document_StartXml() function.
Find out more here.