Differences between revisions 8 and 9
Revision 8 as of 2009-07-17 20:42:05
Size: 1674
Editor: CarlNobile
Comment:
Revision 9 as of 2009-07-17 20:51:52
Size: 2314
Editor: CarlNobile
Comment:
Deletions are marked like this. Additions are marked like this.
Line 6: Line 6:
/*
 * Cross browser event handler.
 *
 * Arguments:
 * obj = The reference object.
 * evType = A string indication the event type like "load".
 * fn = The function to set the event on.
 */
Line 18: Line 26:
/*
 * Insert a node after a node.
 *
 * Arguments:
 * newNode = The new node to insert.
 * refNode = The reference node.
 */
Line 30: Line 45:
/*
 * Get an element by its class name.
 *
 * Arguments:
 * className = The name of the CSS class.
 * count = The ordinal number of the class to find starting at 0 (zero).
 * Returns:
 * The object referenced by the class name.
 */
Line 49: Line 73:
/*
 * A cross browser node extention function.
 */

JavaScript Helper Functions

When you cannot or don't want to use a JavaScript toolkit like jQuery these functions may come in handy. However, they do not globally work on IE. With IE you will need to supply the object that you want it set on.

/*
 * Cross browser event handler.
 *
 * Arguments:
 *   obj = The reference object.
 *   evType = A string indication the event type like "load".
 *   fn = The function to set the event on.
 */
var addEvent = function(obj, evType, fn) {
  if(obj.addEventListener) {
    obj.addEventListener(evType, fn, false);
    return true;
  } else if(obj.attachEvent) {
    var r = obj.attachEvent("on" + evType, fn);
    return r;
  } else {
    return false;
  }
}

/*
 * Insert a node after a node.
 *
 * Arguments:
 *   newNode = The new node to insert.
 *   refNode = The reference node.
 */
var insertAfter = function(newNode, refNode) {
  var result = null;

  if(refNode.nextSibling) {
    result = this.insertBefore(newNode, refNode.nextSibling);
  } else {
    result = this.appendChild(newNode);
  }

  return result;
}

/*
 * Get an element by its class name.
 *
 * Arguments:
 *   className = The name of the CSS class.
 *   count = The ordinal number of the class to find starting at 0 (zero).
 * Returns:
 *   The object referenced by the class name.
 */
var getElementByClass = function(className, count) {
  var result = null;

  for(var i = 0; i < this.childNodes.length; i++) {
    var classCount = 0;

    if(this.childNodes[i].className == className) {
      if(classCount == count) {
        result = this.childNodes[i];
        break;
      }

      classCount++
    }
  }

  return result;
}

/*
 * A cross browser node extention function.
 */
var extendNode = function() {
  // Most browsers have a Node object.
  if(window.Node) {
    Node.prototype.insertAfter = insertAfter;
    Node.prototype.getElementByClass = getElementByClass;
  } else {  // IE doesn't, so we have to set it to the object we need it on.
    var container = document.getElementById("The Object You Need It Set On");
    container.insertAfter = insertAfter;
    container.getElementByClass = getElementByClass;
  }
}

addEvent(window, "load", extendNode);

JavaScriptHelperFunctions (last edited 2009-07-17 20:58:15 by CarlNobile)