Every time I try to load a different page with refresh using jQuery and
window.history.pushState('','',url);
function goto(event,el)
{
url=el.href;
event.preventDefault();
window.history.pushState('','',url);
//$('html').load(url);
$.get(url, function(data) {
var head=data.match(/<head[^>]*>[\s\S]*<\/head>/gi);
$('head').html(head[0]);
//$('#content').html($(data).find('#content').html());
var body=data.match(/<body[^>]*>[\s\S]*<\/body>/gi)
$('body').html(body[0]);
});
}
The HTML is loading before the CSS, resulting in about 1-2 seconds of naked HTML display before the CSS loads completely.
Since all my pages are different, I have to load different CSS and scripts every time.
Is there a way to make the CSS load quicker than the HTML, or is there a better way to load the entire page or replace the current page content with a new page?
I really prefer not to use any plugins.