案例六：动态生成表格

作者: 十六只猴子王 | 来源:发表于2019-04-11 20:08 被阅读0次

创建一个页面，一个按钮，两个输入框

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
行：<input type = "text" id="h"/>
列：<input type = "text" id="l"/><br/>
<input type="button" value="生成" onclick="add();"/>
<div id="divv">

</div>

<script type="text/javascript">
    function add() {
        var h = document.getElementById("h").value;
        var l = document.getElementById("l").value;
        var tab = "<table border='1' bordercolor='blue'>";
         for (var i = 1; i <= h; i++) {
        tab+="<tr>";
        for (var j = 1; j <= l; j++) {
            tab+="<td>aaaaa</td>";
          }
         tab +="</tr>";
          }
        tab +="</table>";
        var divv= document.getElementById("divv");
        divv.innerHTML=tab;
    }</script>
</body>
</html>

屏幕快照 2019-04-11 下午8.08.10.png