在设计网页时,最常常需要使用到的class却没有相对应的方法可以去获取className相同的元素,因此,你想要获得这样的效果,那么,可能自定义一个函数编写代码实现此类功能。
function getElementsByClassName(className) {
var el = new Array();
var _el = document.getElementsByTagName("*");
for (var i=0; i<_el.length; i++ ) {
if (_el[i].className == className) {
el[el.length] = _el[i];
}
}
return el;
}
上面这段代码将会传回一个对象数组,这些对象的class名相同。该方法的缺点是只能在页面加载完成后才能获得正确结果,因为如果直接使用 document.getElementsByTagName("*")得不到全部标签,只能得到body、head、script、body等几个自动加载或已经加载的标签。
解决方法:可以将相关代码放到最后以便body标签加载完成后才执行。
下面这段代码是 getElementsByClassName(className) 众多应用的其中一种,可以将文件中所有 className 为oldClassName的元素的className改为newClassName。
function changeClassName(oldClassName, newClassName) {
var classTest = getElementsByClassName(oldClassName);
for (var i=0; i<classTest.length; i++) {
classTest[i].className = newClassName;
}
}