Advanced Search

HTML5 prefetch / prerender with jQuery

/ Published in: jQuery
Save to your folder(s)
//#########################################################################
//
// *taken from http://www.catswhocode.com/blog/mastering-html5-prefetching
//
//#########################################################################

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. // create an object named "app" which we can define methods on
  2. var app = {
  3.     // returns an array of each url to prefetch
  4.     prefetchLinks: function(){
  5.         // returns an array of each a.prefetch link's href
  6.         var hrefs = $("a.prefetch").map(function(index, domElement){
  7.             return $(this).attr("href");
  8.         });
  9.         // returns the array of hrefs without duplicates
  10.         return $.unique(hrefs);
  11.     },
  12.  
  13.     // adds a link tag to the document head for each of prefetchLinks()
  14.     addPrefetchTags: function(){
  15.         // for each prefetchLinks() ...
  16.         this.prefetchLinks().each(function(index,Element){
  17.             // create a link element...
  18.             $("<link />", {
  19.                 // with rel=prefetch and href=Element...
  20.                 rel: "prefetch", href: Element
  21.                 // and append it to the end of the document head
  22.             }).appendTo("head");
  23.         });
  24.     },
  25. }
  26. // when the document is ready...
  27. jQuery(function(){
  28.   // call the method we defined above.
  29.     app.addPrefetchTags();
  30. }

URL: http://www.catswhocode.com/blog/mastering-html5-prefetching

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.