javascript表,javascript表单提交

如何用javascript绘制动态表格

要上班了,简单写了一段脚本,提供一个思路 主要是通过 javascript + DOM实现的, script function DeleteTr(i) { var table = document.getElementById("table1"); var tr = table.childNodes[0]; tr.removeChild(tr.childNodes[i]); } function AppendTr() { var table = document.getElementById("table1"); var tr = table.childNodes[0]; var trnew = document.createElement("tr"); var td = document.createElement("td"); var text = document.createTextNode("表格内容"); td.appendChild(text); trnew.appendChild(td); tr.appendChild(trnew); } /script table id="table1" border="1" trtd1/td/tr trtd2/td/tr trtd3/td/tr trtd4/td/tr /table input type="button" onclick="DeleteTr(2);" value="delete row 3" input type="button" onclick="AppendTr();" value="Insert row"

相关问答

Q1: 怎么用javascript创建表格

方法一：最原始的方法，创建一一元素

 var a1=document.createElement("table");

 var a2=document.createElement("tbody");

 var a3=document.createElement("tr");

 var a4=document.createElement("td");

 //开始appendchild()追加各个元素

 a3.appendChild(a4);

 a2.appendChild(a3);

 a1.appendChild(a2);

方法二：利用table对象里面含有的函数：插入行和插入列

var tabNode=document.createElement("table");

var trNode=tabNode.insertRow();

var tdNode=trNode.insertCell;

tabNode.innerHTML="这是采用table对象里面的函数创建的"

注意：利用原始方法，一个个createElement时候，必须要添加一个tbody对象

动态的创建和删除：

创建表格，通过输入的值：

function createTable() {

    tableNode = document.createElement("table"); //获得对象   

    tableNode.setAttribute("id", "table")

    var row = parseInt(document.getElementsByName("row1")[0].value); //获得行号 

    //alert(row);   

    if (row = 0 || isNaN(row)) {

        alert("输入的行号错误，不能创建表格，请重新输入：");

        return;

    }

    var cols = parseInt(document.getElementsByName("cols1")[0].value);

    if (isNaN(cols) || cols = 0) {

        alert("输入的列号错误，不能创建表格，请重新输入：");

        return;

    }

    //上面确定了 现在开始创建  

    for (var x = 0; x  row; x++) {

        var trNode = tableNode.insertRow();

        for (var y = 0; y  cols; y++) {

            var tdNode = trNode.insertCell();

            tdNode.innerHTML = "单元格" + (x + 1) + "-" + (y + 1);

        }

    }

    document.getElementById("div1").appendChild(tableNode); //添加到那个位置 

}

删除行：

function delRow() {

    //要删除行，必须得到table对象才能删除，所以在创建的时候必须要设置table对象的 id 方便操作 

    var tab = document.getElementById("table"); //获得table对象  

    if (tab == null) {

        alert("删除的表不存在！")

        return;

    }

    var rows = parseInt(document.getElementsByName("delrow1")[0].value); //获得要删除的对象  

    if (isNaN(rows)) {

        alert("输入的行不正确。请输入要删除的行。。。");

        return;

    }

    if (rows = 1  rows = tab.rows.length) {

        tab.deleteRow(rows - 1);

    } else {

        alert("删除的行不存在！！");

        return;

    } 

}

删除列：

//删除列要麻烦些， 要通过行来进行删除   

// 一行的cells的长度就是列的个数   

//tab.rows[x].deleteCell(cols-1)

function delCols() {

    //获得table对象  

    var tab = document.getElementById("table");

    if (tab == null) {

        alert("删除的表不存在！！");

        return;

    }

    //获得文本框里面的内容    

    var cols = parseInt(document.getElementsByName("delcols1")[0].value);

    //检查是否可靠   

    if (isNaN(cols)) {

        alert("输入不正确。请输入要输出的列。。");

        return;

    }

    if (!(cols = 1  cols  tab.rows[0].cells.length)) {

        alert("您要删除的行不存在！！");

        return;

    }

    for (var x = 0; x  tab.rows.length; x++) {//所有的行  

        tab.rows[x].deleteCell(cols - 1);

    } 

}

Q2: 什么是Javascript样式表

答：javascript是编写程序的脚本语言，是控制程序流程等功能的，不是什么样式表，样式表是css，叫做层叠样式表，主要是控制网页页面的样式的，比如字体大小，页面颜色等等这些内容。也就

Q3: 在javascript中怎样建立表格

// 你的 HTML 的 body 中添加如下内容

// 一个 div 用来放生成的 table ； 一个按钮执行 create

// div id="div"/div

// input type="button" onclick="create()" /

// 以下是 js 方法

script src="" type="text/javascript"/script

script type="text/javascript"

function create() {

// 使用 $("table/table") 生成一个 table

var tab = $("table border='1'/table");

// 3 行循环3次

for (var i = 1; i = 3; i++) {

// 每次生成一个 tr/tr

var row = $("tr/tr");

// 4 列循环 4 次

for (var j = 1; j = 4; j++) {

// 给 tr/tr append（添加） tdi行j列/td

row.append($("td" + i + "行" + j + "列" + "/td"));

}

// 给 table/table 每次循环添加上边的 tr****/tr

tab.append(row);

}

// 最后把生成的 table***/table 放到 id=div 的控件中

$("#div").append(tab);

}

/script

Q4: javascript制作表格

function

addRow(){

//添加一行

var

newTr

=

testTbl.insertRow();

//添加两列

var

newTd0

=

newTr.insertCell();

var

newTd1

=

newTr.insertCell();

//设置列内容和属性

newTd0.innerHTML

=

'';

newTd2.innerText=

'新加行';

}

你自己操作，20次行，5次列，就行了