Skip to content

Instantly share code, notes, and snippets.

@netpoetica
Created September 20, 2012 00:44
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save netpoetica/3753279 to your computer and use it in GitHub Desktop.
Save netpoetica/3753279 to your computer and use it in GitHub Desktop.
custom cross-browser getElementsByClassname and various utility functions
/*
Name: utils.js
Desc: A collection of JS Utility functions, some authored by me (Keith Rosenberg, http://www.keithrosenberg.com)
and some authored by fellow scripters
Location: https://dl.dropbox.com/u/30820392/JS_Utils/utils.js
JavaScript Style Guide - Readable, Consistent Code
Yahoo, Google, Mozilla, jQuery recommendations
Naming:
Variables and Functions
- Allowed letters, numbers, $, and _
- private properties use _ before var name
- use camelCase ;)
Objects
- uppercase first letter (Math, Date)
Brace Style: open curly brace on the same line as the keyword
if (x) {
//....
}
Functions - define them before you call them for readability
Google Closure Compiler (minifier, in browser)
http://closure-compiler.appspot.com/home
*/
//Setup UTILS namespace, make sure it's unique, and if not, make sure we keep what's already there
var UTILS = UTILS || {};
/*
Name: getElementsByClassName(String(className), Node(node))
Desc: Utility function to get elements by className
Author: Keith Rosenberg
Returns: A NodeList of DOM Elements
Example: console.log(getElementsByClassName("newtab-cell"));
Notes:
- Does not require and in fact doesn't work properly if you put a "." in front
of the class name, i.e. ".newtab-cell"
- Returns a NodeList in both instances
- Implements Good Defaults by making "node" an optional arguement that defaults to
document
*/
UTILS.getElementsByClassName = function(className, node){
"use strict";
//Node defaults to document if no node is specified (undefined), or null/false passed to bypass arguement
//try this later: node = !node ? node : document;
node = node ? node : document;
if(document.getElementsByClassName){
// If browser supports this function, use it.
return node.getElementsByClassName(className);
}
else{
// If the browser doesn't support the function, use custom test
var allElems = node.getElementsByTagName("*"),
allElemsLength = allElems.length,
elemList = [], //will be converted to NodeList when populated
i = 0,
currentElem;
//Use traditional for instead of foreach for cross-browser compatability and issues with
//using an object operation (for...each(in)) on NodeLists, which are not quite objects/arrays
for(i; i < allElemsLength; i+=1){
currentElem = allElems[i];
//search() returns -1 if no string found
if(currentElem.className.search(className) !== -1){
elemList.push(currentElem);
}
}
return elemList;
}
};
UTILS.getElementsByAttribute = function(attribute, value, node){
"use strict";
//Node defaults to document if no node is specified (undefined), or null/false passed to bypass arguement
node = node ? node : document;
var allElems = node.getElementsByTagName("*"),
allElemsLength = allElems.length,
elemList = [], //will be converted to NodeList when populated
i = 0,
currentElem;
//Use traditional for instead of foreach for cross-browser compatability and issues with
//using an object operation (for...each(in)) on NodeLists, which are not quite objects/arrays
for(i; i < allElemsLength; i+=1){
currentElem = allElems[i];
//search() returns -1 if no string found
if(currentElem.getAttribute(attribute)){
if(value === null){
elemList.push(currentElem);
}
else {
if(currentElem.getAttribute(attribute) === value){
elemList.push(currentElem);
}
}
}
}
return elemList;
};
/*
Name: randomColorHex
Desc: Utility function to generate a random color
Author: Keith Rosenberg
Returns: String
Example: console.log(randomColorHex()); //#AA00F0
Notes:
- returns string, including #
*/
UTILS.randomColorHex = function(){
// Acceptable numbers are 0-9, letters A-F. A - F represented by 10 - 16 respectively
var hexLen = 6,
hexValues = ['#']
tempDigit = 0;
while(hexLen > 0){
hexLen--;
tempDigit = Math.floor(Math.random() * 16);
switch(tempDigit){
case 10:
tempDigit = 'A';
break;
case 11:
tempDigit = 'B';
break;
case 12:
tempDigit = 'C';
break;
case 13:
tempDigit = 'D';
break;
case 14:
tempDigit = 'E';
break;
case 15:
tempDigit = 'F';
break;
default:
tempDigit = 0;
break;
}
// Make a string
hexValues.push(String(tempDigit));
}
var color = hexValues.join('');
// Ensure we are returning a string
return String(color);
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment