javascript中创建table

原创 2013年12月04日 17:48:07

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="jstable.aspx.cs" Inherits="DOM.jstable" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript">
        function createtable1()
        {
            var tablenode = document.createElement('table');

            //设置表格属性
            tablenode.setAttribute('border', '1px');
            tablenode.setAttribute('width', '500px');
            tablenode.setAttribute('height', '100px');

            //创建第一行
            tablenode.insertRow(0);
            tablenode.rows[0].insertCell(0);
            tablenode.rows[0].insertCell(1);
            tablenode.rows[0].insertCell(2);
            tablenode.rows[0].cells[0].appendChild(document.createTextNode('姓名'));
            tablenode.rows[0].cells[1].appendChild(document.createTextNode('旅游地点'));
            tablenode.rows[0].cells[2].appendChild(document.createTextNode('出发日期'));

            //创建第二行
            tablenode.insertRow(1);
            tablenode.rows[1].insertCell(0);
            tablenode.rows[1].insertCell(1);
            tablenode.rows[1].insertCell(2);
            tablenode.rows[1].cells[0].appendChild(document.createTextNode('刘能'));
            tablenode.rows[1].cells[1].appendChild(document.createTextNode('象牙山'));
            tablenode.rows[1].cells[2].appendChild(document.createTextNode('2013-11-11'));

            //创建第三行
            tablenode.insertRow(2);
            tablenode.rows[2].insertCell(0);
            tablenode.rows[2].insertCell(1);
            tablenode.rows[2].insertCell(2);
            tablenode.rows[2].cells[0].appendChild(document.createTextNode('谢娜'));
            tablenode.rows[2].cells[1].appendChild(document.createTextNode(' 马栏山'));
            tablenode.rows[2].cells[2].appendChild(document.createTextNode('2013-10-10'));

            var divnode = document.getElementById('mydiv');
            divnode.appendChild(tablenode);
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="mydiv">
        <input id="Button1" type="button" value="button"  onclick="createtable1()"/>
    </div>
    </form>
</body>

</html>

版权声明:本文为博主原创文章,未经博主允许不得转载。 举报

相关文章推荐

javascript创建table并实现翻页效果

由于项目的需要,需求做出来一个动态的table并且能够实现翻页,于是自己就花时间搞出来一个,分享给又需要的朋友。 先看看效果: 主要代码: //界面内部...

【javascript】table对象操作,动态创建,删除指定行列

function createTab(){ //动态创建表格 var tabNode = document.createElement("table"); tabNode.setAttribu...

我是如何成为一名python大咖的?

人生苦短,都说必须python,那么我分享下我是如何从小白成为Python资深开发者的吧。2014年我大学刚毕业..

JavaScript动态创建table表格

自动创建表格,主要是利用table对象的insertRow(),和insertCell()等技术
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)