zoukankan      html  css  js  c++  java
  • javascript 动态创建表格

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

    第二种方法:

                <script>
                    
                    function createTable(rows,lines){
                        this.rows=rows;
                        this.lines=lines;
                        var Body=document.getElementById('body');
                        var Table=document.createElement('table');
                        Table.setAttribute('border',1);
                        for(var i=0;i<this.rows;i++){
                            var row=Table.insertRow(i);
                            for(var j=0;j<this.lines;j++){
                                var cells=row.insertCell(j);
                                cells.innerHTML=i+','+j
    
                            }
                        }
                        Body.appendChild(Table);
    
                        
                    }
                </script>
  • 相关阅读:
    Linix的mysql操作
    Linix安装Mongo
    什么是GitHub
    PHP date, strtotime, mktime处理
    正则表达式及使用
    JavaScript的算法和流程控制总结
    JavaScript的DOM编程总结
    Yii中使用的简单方法
    Mongo数据库的导入导出及使用
    linux-0.11内核 任务的堆栈切换
  • 原文地址:https://www.cnblogs.com/ikasa007/p/3487209.html
Copyright © 2011-2022 走看看