前端开发之js基础(5)

DHRMM999

于 2018-09-01 20:18:12 发布

阅读量158

点赞数

分类专栏：前端基础学习 js特效学习笔记文章标签： table

本文链接：https://blog.csdn.net/DHRMM999/article/details/82290321

版权

js特效学习笔记同时被 2 个专栏收录

14 篇文章 0 订阅

订阅专栏

前端基础学习

7 篇文章 0 订阅

订阅专栏

动态生成表格

html代码

<body>
        行：<input type="text" id="rom" /><br />
        列：<input type="text" id="col" />
        <input type="submit" id="add" value="确认生成" onclick="create()"/>
        <div id="create">

        </div>
    </body>

js代码

<script type="text/javascript">
        function create(){
            //获取行列
            var rom = document.getElementById("rom").value;
            var col = document.getElementById("col").value;

            var table = "<table border='1' bordercolor='red' width='300'>";
            for(var i=0;i<rom;i++){
                    table += "<tr>"
                    for(var j=0;j<col;j++){
                        table += "<td>1111</td>"
                    }
                    table += "</tr>"
                }
            table += "</table>";
            document.getElementById("create").innerHTML = table;
        }

    </script>