javascript 动态创建表格_javascript技巧-js教程-PHP中文网

javascript 动态创建表格_javascript技巧

php中文网

发布： 2016-05-16 16:21:33

原创

1220人浏览过

Phidata

Phidata是一个开源框架，可以快速构建和部署AI智能体应用

147

查看详情

复制代码代码如下:

            <script><br />
                function createTable(rows,lines){<br />
                    this.rows=rows;<br />
                    this.lines=lines;<br />
                    var Body=document.getElementById('body');<br />
                    var Table=document.createElement('table');//创建table标签元素<br />
                    Table.setAttribute('border','1');<br />
                    //给table标签添加其他属性<br />
                    for(var i=0;i<this.rows;i++){<br />
                        var lRow=document.createElement('tr');<br />
                        for(var j=0;j<this.lines;j++){<br />
                            var textNode=document.createTextNode(i+','+j);<br />
                            var lLine=document.createElement('td');<br />
                                lLine.appendChild(textNode);<br />
                            lRow.appendChild(lLine);<br />
                        }<br />
                        Table.appendChild(lRow);<br />
                    }<br />
                    Body.appendChild(Table);<br />
                }<br />
            </script>

第二种方法：

复制代码代码如下:

<script><br />
                function createTable(rows,lines){<br />
                    this.rows=rows;<br />
                    this.lines=lines;<br />
                    var Body=document.getElementById('body');<br />
                    var Table=document.createElement('table');<br />
                    Table.setAttribute('border',1);<br />
                    for(var i=0;i<this.rows;i++){<br />
                        var row=Table.insertRow(i);<br />
                        for(var j=0;j<this.lines;j++){<br />
                            var cells=row.insertCell(j);<br />
                            cells.innerHTML=i+','+j<br />
                        }<br />
                    }<br />
                    Body.appendChild(Table);<br />
                    <br />
                }<br />
            </script>