js更改class鼠标事件

来源:百度知道 编辑:UC知道 时间:2024/06/17 16:13:57
<script type="text/javascript">
代码写在这里,不要直接写在标签上,不能在标签上添加id
</script>
<div class="test">鼠标移动到这里改变背景颜色,移出又变回原来的背景颜色</div>
<div class="test">鼠标移动到这里改变背景颜色,移出又变回原来的背景颜色</div>

有两个div,是只不同颜色吗?但两个div用同一个class?

<script type="text/javascript">
window.onload = initClass;
function initClass(){
var classTest = document.getElementsByTagName("div");
for(var i=0; i<classTest.length; i++){
if(classTest[i].className == "test"){
classTest[i].onmouseover = overTest;
classTest[i].onmouseout = outTest;
}
}
}
function overTest(){
this.style.background = "#f00";/*鼠标移上的颜色*/
}
function outTest(){
this.style.background = "#fff";/*鼠标移走的颜色*/
}
</script>

<div class="test">鼠标移动到这里改变背景颜色,移出又变回原来的背景颜色</div>
<div class="test">鼠标移动到这里改变背景颜色,移出又变回原来的背景颜色</div>