ajaxRoute.js is a pure-javascript micro-templating library based on ajax requests for template html files that can have embedded moustache javascript.
It is designed to improve user experience and page load times. Content is loaded only when requested, and the user is never actually leaving the page when an ajaxRoute is performed.
See the test example to learn more! You can take a look at my website as well, which uses a slightly modified version of ajaxRoute.
Simply call the function ajaxRoute
on an object described below.
ajaxRoute({
hash: '/',
url: 'template.html',
destination: '#view'
})
hash
: String hash location e.g. '/' for 'test.html#/'url
: String path to filedestination
: String CSS selector for where parsed content will be placedcontroller
: Object optional contents are referenced in moustache embedded javascriptcallback
: Function(Controller) optional runs after parsed content is placedremoveActive
: String optional CSS selector to remove.active
class from on routebindActive
: String optional Attribute name for which.active
class will be added on route
These two parameters are very useful for cases such as
<footer index about contact>
...
</footer>
Here, you could have the footer only show when on the hashes with the corresponding bindActive values. This would be implemented with removeActive:''
on all ajaxRoutes, and bindActive
set to the HTML attributes used (e.g. index, about, contact).