JS实现动态添加类名

今天遇到这样的一个问题,对于下面这个表格,要实现类似的效果,如果去做呢。忽略IE6,直接对td使用hover伪类,但是达不到这样的效果,只能在指上第一行的时候,前面的大单元格产生效果,要让在第二行,第三行都产生效果,只能使用js。

js添加类名动态增加类名的js函数如下

function addClass(id,className){
	var element  = document.getElementById(id);
	if(element.className == ""){
		element.className = className;	
	}else{
		element.className += " "+className;	
	}
}

在HTML中td上面增加出发条件

<tr onmouseout=”clearClass(‘biaoyan’)”>

当然还要有清除类名的函数(见demo),这样就可以实现上面这种效果了。

最终结果预览 demo

原文链接:,转发请注明来源!

发表评论

  • 1 Responses to “JS实现动态添加类名”