Refresh Stylesheets Bookmarket: refresh stylesheets on a page via javascript bookmarklet

During web development, I sometimes need to edit the stylesheets of the page but I do not want to refresh the whole page and then repeat the steps I took to get to a particular state of the page (find a record, select, click edit, etc...). So I made a quick and dirty bookmarklet that I can click on to refresh all the stylesheets on the current page. Works like magic... tested in IE6/7, FF3 and Chrome.

Drag the link below to your bookmarks, or alternativelly, right click it and hit "Bookmark this link" (in Firefox).

Refresh Stylesheets

How it works:

(function(){   
  var s = document.getElementsByTagName("link");
  for(var i = 0; i < s.length; i++)
     s[i].href += (s[i].href.search(/\?/) >= 0 ? "&" : "?")
        + "random=" + Math.round(Math.random()*10000);
})();

It simply loops through the stylesheets in the current document and appends a random integer to their urls ("random=XYZ"). Since the stylesheet url with the extra query string parameter does not exist in the browser's cache, the browser fetches the newly updated stylesheet.

This can be repeated multiple times, the stylesheet url will just have multiple query string "random" parameters.