1 // Splintered striper 1.3

     2 // reworking of Zebra Tables and similar methods which works not only for tables and even/odd rows,

     3 // but as a general DOM means of assigning any number of classes to children of a parent element.

     4 // Patrick H. Lauke aka redux / www.splintered.co.uk

     5 // Distributed under the Creative Commons Attribution-ShareAlike license - http://creativecommons.org/licenses/by-sa/2.0/

     6 

     7 

     8 /*

     9  * Summary:      Core experiment function that applies any number of classes to all child elements

    10  *               contained in all occurences of a parent element (either with or without a specific class)

    11  * Parameters:   parentElementTag - parent tag name

    12  *               parentElementClass - class assigned to the parent; if null, all parentElementTag elements will be affected

    13  *               childElementTag -  tag name of the child elements to apply the styles to

    14  *               styleClasses - comma separated list of any number of style classes (using 2 classes gives the classic "zebra" effect)

    15  * Return:       none

    16  */

    17 function striper(parentElementTag, parentElementClass, childElementTag, styleClasses)

    18 {

    19 	var i=0,currentParent,currentChild;

    20 	// capability and sanity check

    21 	if ((document.getElementsByTagName)&&(parentElementTag)&&(childElementTag)&&(styleClasses)) {

    22 		// turn the comma separate list of classes into an array

    23 		var styles = styleClasses.split(',');

    24 		// get an array of all parent tags

    25 		var parentItems = document.getElementsByTagName(parentElementTag);

    26 		// loop through all parent elements

    27 		while (currentParent = parentItems[i++]) {

    28 			// if parentElementClass was null, or if the current parent's class matches the specified class

    29 			if ((parentElementClass == null)||(currentParent.className == parentElementClass)) {

    30 				var j=0,k=0;

    31 				// get all child elements in the current parent element

    32 				var childItems = currentParent.getElementsByTagName(childElementTag);

    33 				// loop through all child elements

    34 				while (currentChild = childItems[j++]) {

    35 					// based on the current element and the number of styles in the array, work out which class to apply

    36 					k = (j+(styles.length-1)) % styles.length;

    37 					// add the class to the child element - if any other classes were already present, they're kept intact

    38 					currentChild.className = currentChild.className+" "+styles[k];

    39 				}

    40 			}

    41 		}

    42 	}

    43 }