Search code examples
javascriptjqueryhtmlpushstate

Should I update all hrefs and src when doing a pushState?

If I'm about to call a pushState but I want to preserve all the relative links, images, stylesheets, ect, I do something like this so far:

$('[href]').each(function() { 
    if (!/^#/.test(this.href)) this.href = this.href;
});
$('[src]').each(function() { this.src = this.src });

My question is: will this work cross browser? Do I need to do $(this).attr('href') = this.href ?

Is this necessary? Is there another way to do this? Is this the best way to do it? And is it always going to work?

Solution

  • pushState changes the relative path of the current document.

    You can break or avoid breaking relative sources depending on how you do the relative path.

    The ./* pattern does relative paths off the current path, but plan old /* will always start at the path root and would be unaffected by pushState changes.

    ./this/would/break.jpg

/this/wont.jpg