日期:2014-05-16  浏览次数:20340 次

请牛人帮我看看这段代码为什么不能显示效果
我想当鼠标移过上边的彩色部分是有东西输出,但是没有实现,我看了看代码也没看出毛病,请牛人帮我卡看,谢谢^-^

<!DOCTYPE   HTML   PUBLIC   "-//W3C//DTD   HTML   4.01   Transitional//EN ">
<HTML>
  <HEAD>
    <TITLE>   New   Document   </TITLE>
    <style>
.body{
background-color:while;
}
.musicalKeys{
background-color:#ffe0d0;
border:solid   maroon   2px;
width:536px;
height:68px;
top:24px;
left:24px;
margin:4px;
position:absolute;
overflow:auto;
}
.musicalButton{
border:solid   navy   1px;
width:60px;
height:60px;
position:relative;
margin:2px;
float:left;
}
.do{background-color:red;}
.re{background-color:orange;}
.mi{background-color:yellow;}
.fa{background-color:green;}
.so{background-color:blue;}
.la{background-color:indigo;}
.ti{background-color:violet;}
div.console{
font-family:arial,helvetica;
font-size:16px;
color:navy;
background-color:while;
border:solid   navy   2px;
width:536px;
height:320px;
top:106px;
left:24px;
margin:4px;
position:absolute;
overflow:auto;
}
    </style>
    <script>
window.onload=function(){
var   keyboard=document.getElementById( "keyboard ");
var   keys=keyboard.getElementsByTagName( "div ");
if(keys){
for(var   i=0;i <keys.length;i++){
var   key=keys[i];
var   classes=(key.className).split( "   ");
if(classes&&classes.length> =2&&classes[1]== "musicalButton "){
var   note=classes[0];
key.onmouseover=playNote;
}
}
}
}
function   playNote(event){
var   note=this.note;
var   console=document.getElementById( "console ");
if(console&&note){
console.innerHTML+=note+ "   .   ";
}
}
    </script>
  </HEAD>

  <BODY>
    <div   id= "keyboard "   class= "musicalKeys ">
<div   class= "do   musicalButton "> </div>
<div   class= "re   musicalButton "> </div>
<div   class= "mi   musicalButton "> </div>
<div   class= "fa   musicalButton "> </div>
<div   class= "so   musicalButton "> </div>
<div   class= "la   musicalButton "> </div>
<div   class= "ti   musicalButton "> </div>
<div   class= "do   musicalButton "> </div>
    </div>
    <div   id= "console "   class= "console ">
    </div>
  </BODY>
</HTML>

------解决方案--------------------
<script>
window.onload=function(){
var keyboard=document.getElementById( "keyboard ");
var keys=keyboard.getElementsByTagName( "div ");
if(keys){
for(var i=0;i <keys.length;i++){
var key=keys[i];
var classes=(key.className).split( " ");
if(classes&am