jsp动态生成table

最新推荐文章于 2023-01-11 21:15:42 发布

转载最新推荐文章于 2023-01-11 21:15:42 发布 · 1.9k 阅读

前端专栏收录该内容

45 篇文章

订阅专栏

<script type="text/javascript">  
    function generate(){  
        var line = document.getElementById("line").value;//获取行数  
        var row = document.getElementById("row").value;//获取列数  
          
        var div = document.getElementById("tab");//获取到存放生成table的div  
        var table = document.createElement("TABLE");//创建table元素  
          
        for(var i=0;i<line;i++){//循环创建单元格，并填充内容  
            var tr = document.createElement("TR");  
            for(var j=0;j<row;j++){  
                var td = document.createElement("TD");  
                var tdText = document.createTextNode(row * i + j + 1);  
                td.appendChild(tdText);  
                tr.appendChild(td);  
            }  
            table.appendChild(tr);  
        }  
        table.setAttribute("border", "1");//设置表框属性  
        div.appendChild(table);//将创建的table附加到div中  
    }  
  </script>  
  <body>  
    行：<input type="text" name="line" id="line">  
    列：<input type="text" name="row" id="row">  
    <input type="button" value="生成表格" onclick="generate()">  
    <div id="tab">  
    </div>  
  </body>