2008-05-22

[原创]tbody的妙用

最近在写一个项目，用到这样一个Javascript功能，

将一个table分成几段，能够动态的插入行和列，自然而然就想到appendChild方法，但是发现在IE和FF里面，两个方法并不能通用，后来经过分析，使用tbody就可以解决这样的问题。

而且一个table 可以分成几个tbody,达到在不同的位置插入行的目的，如下代码所示:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
  <script>
    function add(i){
        var tt = document.getElementById("tt");
        /*var newTr = tt.insertRow(i);
        var newTd0 = newTr.insertCell(-1);
        newTd0.innerHTML="<input type='text'/>";*/

        var r = document.createElement("tr");
        var t = document.createElement("td");
   
        t.innerHTML="ffffffffffffffffff";
        r.appendChild(t);
        tt.appendChild(r);
    }

    function add1(i){
        var tt = document.getElementById("tt1");
        /*var newTr = tt.insertRow(i);
        var newTd0 = newTr.insertCell(-1);
        newTd0.innerHTML="<input type='text'/>";*/

        var r = document.createElement("tr");
        var t = document.createElement("td");
   
        t.innerHTML="ffffffffffffffffff";
        r.appendChild(t);
        tt.appendChild(r);
    }
  </script>
 </HEAD>

 <BODY>
 <input type="button" name="add 2" onclick="add(2)">
 <input type="button" name="add 4" onclick="add1(-1)">
 <table border=1 width=100%>

<!--这里一个-->
 <tbody id="tt">
 </tbody>
 <tr>
 <td>111</td>
 </tr>
  <tr>
 <td>2222222222</td>
 </tr>
  <tr>
 <td>3333</td>
 </tr>

<!--这里又一个-->
   <tbody id="tt1">
 </tbody>
  <tr>
 <td>44</td>
 </tr>

 </table>
 </BODY>
</HTML>

 

 

另在加上一个右键菜单的功能，发现使用DOM 的 setAttribute方法，很有用处。

 

-----------------------------------------------------------------------------

<form   id= "Form1 "   method= "post "   runat= "server ">
<INPUT   type= "text "   name= "city ">
</form>

Head之间有一段js，其中有一个变量city，我用alert(city);可以得到值，但是怎么在js中把这个值赋给这个html控件？

document.all.city.value=city;试过了，不行。  
<form   id= "Form1 "   method= "post "   runat= "server "> 这个form也去掉了，不行。
  method= "post "   runat= "server "这句也去了，不行。

 

<INPUT   type= "text "   name= "city "   id= "city ">
注意要加上   id= "city "

脚本楼上的都对。

评论
Simon Chen 2008-07-11
发表评论

您还没有登录，请登录后发表评论

kayo
搜索本博客
我的相册
Ad1461d2-8745-3eba-ab39-18389260fce2-thumb
s1125472579
共 14 张
最近加入圈子
存档
最新评论