朋友们 帮帮忙！

<table><tr><td></td></tr></table>
我想动态改变td大小,给两个BUTTON  当点击一个是td加1px  另一个是减1px ，
js该怎么写呢 ,我写得有问题，只能让让它实现一次，
而我想实现的 是点多次 都递增加1。
该怎么做呢 ，大家帮帮忙谢谢！

解决方案 »

  1.   

    <script>
    function oo(e){
    document.getElementById('tab').style.width=(parseInt(document.getElementById('tab').style.width)+e)+"px"
    document.getElementById('tab').style.width=(parseInt(document.getElementById('tab').style.width)+e)+"px"
    }
    </script> 
    <table   border="1"> <tr> <td id="tab" style="width:200px;"> </td > </tr> </table> 
    <input value="++" type="button" onClick="oo(1)"><input value="--" type="button" onClick="oo(-1)">
      

  2.   


    <html>
    <head>
    <title></title>
    <script language="javascript"> 
    function add(n){
    var td = document.getElementById("td1");
    var height = td.offsetHeight + n;
    td.height = height;
    }
    </script>
    </head>
    <body>
    <table border="1">
    <tr><td id="td1">第一行</td></tr>
        <tr><td>第二行</td></tr>
    </table>
    <input type="button" value=" + " onclick="add(1)" />
    <input type="button" value=" - " onclick="add(-1)"
    </body>
    </html>
      

  3.   

    <script>
    function jia(value){
    document.getElementById('aa').style.width=(parseInt(document.getElementById('aa').style.width)+value)+"px"
    document.getElementById('aa').style.height=(parseInt(document.getElementById('aa').style.height)+value)+"px"
    document.getElementById('aa').style.width=(parseInt(document.getElementById('aa').style.width)+value)+"px"
    document.getElementById('aa').style.height=(parseInt(document.getElementById('aa').style.height)+value)+"px"
    }
    </script> 
    <table   border="1"> <tr> <td id="aa" style="width:200px;height:20px;"> </td > </tr> </table> 
    <input value="加" type="button" onClick="jia(1)"><input value="减" type="button" onClick="jia(-1)">
      

  4.   


    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head><body>
    <table  border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td width=20 bgcolor="#FF0000" id=td1>&nbsp;</td>
        <td width=20 bgcolor="#00FF00">&nbsp;</td>
        <td width=20 bgcolor="#6600FF">&nbsp;</td>
      </tr>
    </table>
    <label>
    <input type="button" name="button2" id="button2" value="增加" onclick="tdinc()"/>
    <input type="button" name="button" id="button" value="减少"  ONCLICK="tddec()"/>
    </label>
    </body>
    <script>
    function tdinc()
    {
    objs=document.getElementById("td1");
    objs.width++;
    }

    function tddec()
    {
    objs=document.getElementById("td1");
    objs.width--;
    if (objs.width<1) objs.width=1;
    }
    </SCRIPT>
    </html>
      

  5.   

     <table><tr><td style="background-color:Blue ;width:200px;">
           <input type="button" value="加"  onclick="op(this,1)"/>
           <input type="button" value="减"  onclick="op(this,2)"/></td></tr></table><script type="text/javascript">
          function op(o,type){
            var td=o.parentNode,step=type==1?1:-1;
            td.style.width=parseInt(td.style.width)+step+"px";
          }
    </script>