有用的Javascript函数

最近常用Javascript，慢慢就知道总结一些常用的Javascript任务及其解决方法，这在Javascript里尤其重要，因为Javascript经常需要解决一些浏览器不兼容的问题，而这些问题的解决方法通常不够优雅，很难以琢磨，但又很管用，这和Java开发者们的模式驱动有很大区别，所以搞个小册子记录一下，其实很有必要。这些函数大多不是我写的，感谢它们的原作者们（由于这些函数的广泛传播，已经很难指出它们的原作者了），让Javascript不至于那么让人生畏。

挂接事件

在Javascript下挂接事件，并不复杂，等号就可以搞定，但要实现事件的级联处理（即新挂上去的事件要去调用以前已经挂好的事件）以及浏览器的广泛兼容，却不是那么容易，这是我正在用的：

1
2
3
4
5
6
7
8
9
10
11
12
13

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;
	}
}

不过还是要注意，有些场合是不能用这种挂接事件的，比如处理window的onbeforeclose事件，就应该直接等号赋值，否则按照上面的做法，你的事件处理函数在被调用之后可能又去调别的浏览器挂好的事件，那么你的函数的返回值就相当于被丢弃了，我就遇到过这样的问题。

取Flash对象

这个我在前面的帖子里已经给了，对我来说比较常用，但可能不是每个人都觉得这个有用，取决于你用不用Flash对象。

getElementsByClass

这从字面上就很容易看出，是按照Class去取对象，和标准的Javascript里面getElementById对照，当然如果你使用JQuery这样的Javascript库，就不需要这个函数了（JQuery有很棒的getElement方法），不过在没有JQuery的时候，用下这个函数也不错，注意，它的实现并不是很简单，因为一个元素可以有多个class，可以写在一起用空格分开，所以为了检查class，下面的函数用到了正则表达式。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

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.test(els[i].className) ) {
			classElements[j] = els[i];
			j++;
		}
	}
	return classElements;
}

切换显示

这个函数倒是比较简单，直接明了，不用怎么解释了：

1
2
3
4
5
6
7
8
9

function toggle(obj) {
	var el = document.getElementById(obj);
	if ( el.style.display != 'none' ) {
		el.style.display = 'none';
	}
	else {
		el.style.display = '';
	}
}

有待增补～

August 28th, 2009 in code|编程

Leave a comment

Your comment