Ajax, one of the coolest techniques for web development, has brought a lot of dynamicity and flexibility to us. But it also has lot of limitations, and that’s why I always tell people to ask themselves whether they really need ajax or not before they start developing a project.
Why CSS & JS are not loaded defaultly
** Parent page means the page where I’m loading, and child page is the page which I’m loading.
How to force load them
Let’s consider, the id of the div of the parent page is ‘mainPage’, where we will load the child page. So first of all, I’ve changed the internal html and have showed a text ‘Loading…’.
In line number 3, the variable ‘pagelink’ is initialized with a the path of the folder where I have my child page.
By using the variable ‘url’, I have set the exact path of the particular file, which is my child page.
Risk factors & solutions
1. Placements: Sometimes few browsers don’t load the contents of the <head> element. So to be in the safer side, put your <link /> and <script> tags outside the <head> element of the child page.
2. Names: Don’t give same id or class names in both the pages; or make some logical separation. Otherwise they will conflict.
3. Path: In this demo I’ve considered the href of links or src of scripts are referring files from the same folder. But if they have references from parent folders (like, src=”../../js/main.js”), then you have to perform logical operations to get the relative link.