Get Elements by Data-Attribute

main.js

// Define a getElementsByAttribute function. It
// takes an attribute name string and an optional
// matching value. It calls walk_the_DOM, passing it a
// function that looks for an attribute name in the
// node. The matching nodes are accumulated in a
// results array.

var getElementsByAttribute = function (att, value) {
  var results = [];
  walkTheDom(document.body, function(node){
    var actual = node.nodeType === 1 && node.getAttribute(att);
    if (typeof actual === 'string' && (actual === value || typeof value !== 'string')) {
      results.push(node);
    }
  });
  return results;
};
var menus = getElementsByAttribute('data-role', 'navigation');

walkthedom.js

var walkTheDom = function walk(node, func) {
  func(node, 'LI');
  node = node.firstChild;
  while (node) {
    walk(node, func);
    node = node.nextSibling;
  }
};