js 取一行的值

   点击一行，给一行加背景色，点击别一行，把上一行的背景色去除。
    并取出这一行的值 。
    用JS 来实现，jquery 就不要说了。我知道用jquery 很简单。。
     
function changeRow(obj)
{
   obj.style.background="#aaaaaa";
  
}
只加上颜色不知道怎么去除。本人JS 不强。谢谢了。 

解决方案 »

  1.   


    <head>
    <script language="javascript">    function changeRow(obj) { 
    obj.style.background="#333333"; 
    }</script>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    </head>
    <body>
    <table border="1">
    <tr onClick="changeRow(this);" style=" background:#FFFFFF">
    <td>111</td>
    <td>222</td>
    <td>333</td>
    </tr>
    <tr onClick="changeRow(this);" style=" background:#FFFFFF">
    <td>444</td>
    <td>555</td>
    <td>666</td>
    </tr>
    </table>
    </body>
      

  2.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>div</title>
    <style type="text/css">
    #vertmenu {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 100%;
    width: 160px;
    padding: 0px;
    margin: 0px;
    }#vertmenu h1 {
    display:block;  
    background-color:#FF9900;
    font-size: 90%;  
    padding: 3px 0 5px 3px;
    border: 1px solid #000000;
    color: #333333;
    margin: 0px;
    }ul{
        margin:0; padding:0;}li{
        list-style:none;
        margin:0; padding:0;
    }
    li a{
        color:blue;
        text-decoration:none;
        display:block;
        border-bottom:dashed 1px orange;
        padding:5px 10px;
        width:140px;
        font-size:13px;
    }
    li a:hover{
        color:white;background:#CCCCCC;}
        
    .li_current a{
        background:yellow; color:green; font-weight:bold;}</style>
    <script type="text/javascript">
    function setbgColor(o)
    {
        o.className="li_current"; 
        var lis = document.getElementById("vertmenu").getElementsByTagName("li");
        //var lis = document.getElementsByTagName("li");
        for(var i=0;i<lis.length;i++)
        {
            lis[i].className=""; //获取所有的li，并设置背景眼神为默认
        }
        //设置当前点击的li背景颜色为红色：li_current样式
        o.className="li_current"; 
    }
    </script>
    </head>
    <body>
    <div id="vertmenu">
        <h1>导航文本</h1>
        <ul>
            <li onclick="setbgColor(this)"><a href="#" tabindex="1">Home</a></li>
            <li onclick="setbgColor(this)"><a href="#" tabindex="2">About Us</a></li>
            <li onclick="setbgColor(this)"><a href="#" tabindex="3">Computing</a></li>
            <li onclick="setbgColor(this)"><a href="#" tabindex="4">Web Sites</a></li>
            <li onclick="setbgColor(this)"><a href="#" tabindex="5">Games</a></li>
            <li onclick="setbgColor(this)"><a href="#" tabindex="6">Links</a></li>
        </ul>
    </div>
    </body>
    </html>
      

  3.   

    var t;// 你的表格对象for(var i=0;i<t.rows.length;i++)
    {
    (function(i){t.rows[i].onclick=function(){setBgColor(i);};})(i);
    } 
    function setBgColor(r)
    {
    for(var i=0;i<t.rows.length;i++)
    {
    if(r==i){
    t.rows[i].style.backgroundColor="#aaa";
    }else{
    t.rows[i].style.backgroundColor="";// 默认颜色
    }
    }
    }
      

  4.   


    <style>
        div{border:1px #333 dotted;width:180px;height:20px;background:#eee}
      </style>
      <script>
         function chkbgColor(e)
     {

    var x = document.getElementsByTagName("div")
    //alert(x)
    for (var i=0;i<x.length;i++ )
    {
         x[i].style.background="#eee"
    }
    e.style.background = "red"
     }
      </script>
     </head> <body>
      <div onclick="chkbgColor(this)"></div>
      <div onclick="chkbgColor(this)"></div>
      <div onclick="chkbgColor(this)"></div>
     </body>