如何通過javascript動態改變按鈕的css屬性值

要實現的效果就是：
   按鈕在正常的時候是透明的，沒有邊框的；
   按鈕在滑鼠移上之後就變成有背景色，有邊框；
前後對比如下：
 
圖1 正常顯示的情況 
 
圖2 滑鼠移上到按鈕之上時
這些按鈕的html代碼如下：

 

 1                <input runat=server id=changestate type=button value="顯示添加曲線" class=curvebutton onmouseover="buttonMouseOver('changestate')" onmouseleave="buttonMouseLeave('changestate')" onserverclick="changestate_Click" />
 2                <input type="hidden" id="hideinfo" runat="server" value="hide" />                                            
 3                <input runat=server id=privewbutton type=button value="前一時段" class=curvebutton onmouseover="buttonMouseOver('privewbutton')" onmouseleave="buttonMouseLeave('privewbutton')" onserverclick="changestate_Click" />
 4                <input runat=server id=currentbutton type=button value="當前時段" class=curvebutton onmouseover="buttonMouseOver('currentbutton')" onmouseleave="buttonMouseLeave('currentbutton')" onserverclick="changestate_Click" />
 5                <input runat=server id=nextbutton type=button value="後一時段" class=curvebutton onmouseover="buttonMouseOver('nextbutton')" onmouseleave="buttonMouseLeave('nextbutton')" onserverclick="changestate_Click" />
 6                <input runat=server id=refleshcurvebutton type=button value="更新曲線" class=curvebutton onmouseover="buttonMouseOver('refleshcurvebutton')" onmouseleave="buttonMouseLeave('refleshcurvebutton')" onserverclick="changestate_Click" />
 7                <input runat=server id=viewdatabutton type=button value="察看資料" class=curvebutton onmouseover="buttonMouseOver('viewdatabutton')" onmouseleave="buttonMouseLeave('viewdatabutton')" onserverclick="changestate_Click" />
 8                <input runat=server id=privewpagebutton type=button value="上一頁" disabled=disabled class=curvebutton onmouseover="buttonMouseOver('privewpagebutton')" onmouseleave="buttonMouseLeave('privewpagebutton')" onserverclick="changestate_Click" />
 9                <input runat=server id=nextpagebutton type=button value="下一頁" disabled=disabled class=curvebutton onmouseover="buttonMouseOver('nextpagebutton')" onmouseleave="buttonMouseLeave('nextpagebutton')" onserverclick="changestate_Click" />
10

 其中用到的兩個javascript函數的代碼如下：

 

 1    <script language=javascript>  
 2        function buttonMouseOver(source)
 3        {                                    
 4            try {                                 
 5                document.all(source).style.backgroundColor="#f1f1f1";
 6                document.all(source).style.border="solid 1px #cccccc";
 7            }
 8            catch(e){ alert(e)}
 9        }
10        function buttonMouseLeave(source)
11        {            
12            try {                
13                document.all(source).style.backgroundColor="Transparent";
14                document.all(source).style.border="solid 0px #cccccc";
15            }
16            catch(e){ alert(e)}
17        }      
18    </script>

 其中的css class  curvebutton的設定如下：

.curvebutton{}{ background-color:Transparent; border-style:none; width:100%; cursor:pointer; text-align:left; padding-left:30px}

這樣使用基本就沒錯嘍。