十个常用的javascript函数

Top 10 custom JavaScript functions of all time

UPDATE: For anyone who lands on this article months after the fact , there is now a podcast entry about this article reviewing each and every function. If there was ever a universal common.js shared among the entire develosphere, you'd fine these ten (plus one bonus) functions. It would be the swiss army knife no developer would go into production without. They have no doubt been tested tried and true and have proven usefulness and helpfulness to all those who've used them. So without further ado, here are what I believe to the top ten greatest custom JavaScript functions in use today. Upon further reading this article, it is suggested that for this article in particular the reader should use an alternate style with cleaner whitespace and larger margins. This is available by selecting Clean with Whitespace available on the side bar.

10) addEvent()

Surely a staple to event attachment! Regardless to what version you use written by whatever developer, it does what it says it does. And of course as you might of known, I've put together quite a handy version myself recently of addEvent() with some help from the contest winner and Mark Wubben along with a few minor syntax adjustments. But just to be fair to Scott Andrew , here is the original that started it all.

Scott Andrew's original addEvent() function

function addEvent(elm, evType, fn, useCapture) {

	if (elm.addEventListener) { 

		elm.addEventListener(evType, fn, useCapture); 

		return true; 

	}

	else if (elm.attachEvent) { 

		var r = elm.attachEvent('on' + evType, fn); 

		return r; 

	}

	else {

		elm['on' + evType] = fn;

	}

}

9) addLoadEvent()

Originally written by Simon Willison and highly adopted by many others as a simple way to add events to trigger after the page has loaded. This of course attaches all your events to the onload event handler which some still see as necessary, nevertheless it does exactly what it's supposed to, and does it well.

addLoadEvent() by Simon Willison

function addLoadEvent(func) {

	var oldonload = window.onload;

	if (typeof window.onload != 'function') {

		window.onload = func;

	}

	else {

		window.onload = function() {

			oldonload();

			func();

		}

	}

}

Of course another method is to simply assign multiple event listeners to the window by using addEvent() as described in number 10 as follows:

assigning multiple load events to window

addEvent(window,'load',func1,false);

addEvent(window,'load',func2,false);

addEvent(window,'load',func3,false);

8) getElementsByClass()

Originially written by nobody in particular. Several developers have implemented their own version and no one single version has proven to be better than another. As you might expect, my humble self has even had a crack at it . This function was spawned from developers needing a quick and elegant way of grabbing elements by a className and to a developer's surprise, it's not an original DOM method as one might think...afterall, we have getElementById , getElementsByName() , getElementsByTagName , what the hell happened to getElementsByClass ??? Here it is in all its glory:

getElementsByClass by Dustin Diaz

function getElementsByClass(searchClass,node,tag) {

	var classElements = new Array();

	if ( node == null )

		node = document;

	if ( tag == null )

		tag = '*';

	var els = node.getElementsByTagName(tag);

	var elsLen = els.length;

	var pattern = new RegExp('(^|\\\\s)'+searchClass+'(\\\\s|$)');

	for (i = 0, j = 0; i < elsLen; i++) {

		if ( pattern.t