大家好，帮我分析一段代码吧，很短。。。

前天在CSDN发帖问了关于鼠标移动改变底色而不受超链接影响的问题，浪迹天涯大哥给了下面的代码，确实有用，但是啊现在要求变了！我是个杯具的小白，代码连改都不会改。现在不仅是需要底色改变，还要有其他的动作，我没有JS基础，不知道怎么把.style.background = "Gray"进行改变，使其执行其他动作，比如改变文字大小啊，背景啊，或者干脆执行一个事先做好的CSS，谢谢大家了！
<html><head>
    <title></title>
    <script type="text/javascript">
        function MouseUp() {
            var div = document.getElementById("div");
            div.style.background = "Red";
        }
        function MouseLeft() {
            var div = document.getElementById("div");
            div.style.background = "Gray";
        }
    </script>
</head>
<body>
    <div style=" width:50px; height:20px; background-color:Gray" onmouseover="MouseUp()" onmouseout ="MouseLeft()" id="div">
        <a href="http://www.baidu.com">百度</a>
    </div>
</body>
</html>

解决方案 »

  1.   

    你会CSS不？如果这个不会，咱遁了
      

  2.   


    <html>
    <head>
      <title>test</title>
      <style type="text/css">
      .mouseover{color:white;background:red;width:150px; height:120px;line-height:25px;}
      .mouseup{color:black;background:yellow;width:150px; height:120px;line-height:25px;}
      </style>
      <script type="text/javascript">
      function MouseUp() {
      var div = document.getElementById("div");
      div.className='mouseover';
      }
      function MouseLeft() {
      var div = document.getElementById("div");
      div.className='mouseup';
      }
      </script>
    </head>
    <body>
      <div onmouseover="MouseUp()" onmouseout ="MouseLeft()" id="div">
      <a href="http://www.baidu.com">百度</a>
      </div>
    </body>
    </html>
    其他代码不用动。改这2个CSS文件的代码即可。
      

  3.   

    改变：
     .mouseover{color:white;background:red;width:150px; height:120px;line-height:25px;}
      .mouseup{color:black;background:yellow;width:150px; height:120px;line-height:25px;}
      

  4.   


    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <style type="text/css">
              .mouseover{color:white;background:#c0c0c0;width:100px; height:100px;}
              .mouseup{color:black;background:yellow;width:100px; height:100px;}
        </style>
        <script type="text/javascript">
              function MouseUp() {
                  var div = document.getElementById("div");
                  div.className = 'mouseover';
                  div.innerHTML = "Google";
                  div.style.fontWeight = "bold";
              }
              function MouseOut() {
                  var div = document.getElementById("div");
                  div.innerHTML = "百度";
                  div.className = 'mouseup';
              }
        </script>
    </head>
    <body>
          <div onmouseover="MouseUp()" onmouseout ="MouseOut()" id="div">百度</div>
    </body>
    </html>改了下！希望对你有帮助