分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 运营维护

运用js创建表格

发布时间:2023-09-06 01:27责任编辑:傅花花关键词:js

<html>
    <head>
        <title>运用js创建表格</title>
    </head>
    <body>
        <table>
        </table>
    
    
    <script type="text/javascript">
    
        /*function createTable(){
            var body = document.body;
            
            var table = document.createElement("table");
            
            var tr = document.createElement("tr");
            
            var td = document.createElement("td");
            
            var txt = document.createTextNode("hello,world");
            
            td.appendChild(txt);
            tr.appendChild(td);
            table.appendChild(tr);
            table.style.border = "1px solid black";
            
            body.appendChild(table);
            
        }*/
        
        
        function createDuoTable(){
            var body = document.body;
            var table = document.createElement("table");
            for(var i=0;i<4;i++){
                
                var tr = document.createElement("tr");
                
                var td = document.createElement("td");
                
                var txt = document.createTextNode("hello,world");
                
                td.appendChild(txt);
                tr.appendChild(td);
                table.appendChild(tr);
                td.style.border = "1px solid black";
                if(i%2){
                    tr.style.backgroundColor = "#DDD";
                } else {
                    tr.style.backgroundColor = "green";
                }
                
            }
            table.style.border = "1px solid black";
            body.appendChild(table);
            
        }
        
        createDuoTable();
    </script>
    
    
    </body>
</html>

效果如下:

运用js创建表格

原文地址:http://www.cnblogs.com/luowenjun-kio/p/7899920.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved