Shoora
1/30/2014 - 9:35 PM

Automatically cache your DOM queries using a wrapper function like this.

Automatically cache your DOM queries using a wrapper function like this.

// jQuery wrapper
var cacheQuery = function(query) {
  this.cache = this.cache || {};
  
  if (!this.cache[query]) {
    this.cache[query] = jQuery(query);
  }
  
  return this.cache[query];
};


// DOM wrapper
var cacheQuery = function(query) {
  this.cache = this.cache || {};
  
  if (!this.cache[query]) {
    this.cache[query] = document.querySelectorAll(query);
  }
  
  return this.cache[query];
};


// Example
cacheQuery('.myForm input[type=submit]').val('Processing'); // Returns `DOMElement` or a jQuery object after a lookup
cacheQuery('.myForm input[type=submit]').attr('disabled', true); // Returns same `DOMElement` or jQuery object but without doing a lookup