Differences between revisions 1 and 9 (spanning 8 versions)
Revision 1 as of 2009-07-13 15:58:43
Size: 743
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 3: Line 3:
When you cannot use a JavaScript toolkit like [[http://jquery.com|jQuery]] these functions may come in handy. When you cannot or don't want to use a !JavaScript toolkit like [[http://jquery.com|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.
Line 6: Line 6:
Node.prototype.insertAfter = function(newNode, refNode) {
  if(refNode.nextSibling) {
    return this.insertBefore(newNode, refNode.nextSibling);
/*
 * 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;
Line 10: Line 22:
    return this.appendChild(newNode);     return false;
Line 14: Line 26:
Node.prototype.getElementByClass = function(className, count) { /*
 * 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) {
Line 32: Line 72:

/*
 * 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);

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)