<body>
<script type="text/javascript">

/*
*上面的方法和你麻烦。
*既然操作的是表格，
*那么最方便的方式就是使用表格节点对象的方法。
*
*表格是由行组成。表格节点对象中insertRow方法就完成了创建行并添加的动作。
*
*行是有单元格组成。通过tr节点对象的insertCell来完成。
*/

function crtTable(){
var oTabNode = document.createElement("table");

oTabNode.setAttribute("id","tabid");

var rowVal = parseInt(document.getElementsByName("rownum")[0].value);
var colVal = parseInt(document.getElementsByName("celnum")[0].value);

for(var x=1;x<=rowVal;x++){
var oTrNode = oTabNode.insertRow();
for(var y =1;y<=colVal;y++){
var oTdNode = oTrNode.insertCell();
oTdNode.innerHTML = x+"---"+y;
}
}

//将表格节点添加到div中。
document.getElementsByTagName('div')[0].appendChild(oTabNode);
document.getElementsByName("crtBut")[0].disabled=true;
}

//删除行
function delRow(){

//获取表格对象
var oTabNode = document.getElementById("tabid");
if(oTabNode==null){
alert("表格不存在");
return;
}

//获取要删除的表格行数。
var rowVal = document.getElementsByName("delrow")[0].value;

if(rowVal>=1 && rowVal<= oTabNode.rows.length){
oTabNode.deleteRow(rowVal-1);
}else{
alert("要删除的行不存在");
}
}

//删除咧，其实就是删除每一行中同一位置的单元格。
function delCol(){
//获取表格对象
var oTabNode = document.getElementById("tabid");
if(oTabNode==null){
alert("表格不存在");
return;
}

//获取要删除的表格列数。
var colVal = document.getElementsByName("delcol")[0].value;

if(colVal>=1 && colVal<=oTabNode.rows[0].cells.length){

for(var x=0; x<oTabNode.rows.length; x++){

oTabNode.rows[x].deleteCell(colVal-1);

}

}else{
alert("要删除的列不存在");
}

}
</script>

<input type="button" value="创建表格" name="crtBut" onclick="crtTable()" />
行：<input type="text" name="rownum" />列：<input type="text" name="celnum"/>
<hr/>
<input type="text" name="delrow"/><input type="button" value="删除行" onclick="delRow()"/>
<input type="text" name="delcol"/><input type="button" value="删除列" onclick="delCol()"/>
<hr/>
<div></div>
</body>

示例-创建表格-指定行列&删除表格的行和列的更多相关文章

  1. python excel操作 练习-#操作单列 #操作A到C列 #操作1到3行 #指定一个范围遍历所有行和列 #获取所有行 #获取所有列

    ##操作单列#操作A到C列#操作1到3行#指定一个范围遍历所有行和列#获取所有行#获取所有列 #coding=utf-8 from openpyxl import Workbook wb=Workbo ...

  2. 【jQuery 冻结任意行列】冻结任意行和列的jQuery插件

    实现原理: 创建多个div,div之间通过css实现层叠,每个div放置当前表格的克隆.例如:需要行冻结时,创建存放冻结行表格的div,通过设置z-index属性和position属性,让冻结行表格在 ...

  3. PostgreSQL 删除表格

    PostgreSQL 使用 DROP TABLE 语句来删除表格,包含表格数据.规则.触发器等,所以删除表格要慎重,删除后所有信息就消失了. 语法 DROP TABLE 语法格式如下: DROP TA ...

  4. Python中pandas dataframe删除一行或一列：drop函数

    用法:DataFrame.drop(labels=None,axis=0, index=None, columns=None, inplace=False) 参数说明:labels 就是要删除的行列的 ...

  5. javascript动态创建表格：新增、删除行和列

    转载:http://www.cnblogs.com/pato/archive/2009/09/02/1559068.html 利用js来动态创建表格有两种格式,appendChild()和insert ...

  6. C# 操作Word文本框——插入表格/读取表格/删除表格

    在文本框中,我们可以操作很多元素,如文本.图片.表格等,在本篇文章中将着重介绍如何插入表格到文本框,插入的表格我们可以对表格进行格式化操作来丰富表格内容.此外,对于文本框中的表格内容,我们也可以根据需 ...

  7. C# 实现对PPT插入、编辑、删除表格

    现代学习和办公当中,经常会接触到对表格的运用,像各种单据.报表.账户等等.在PPT演示文稿中同样不可避免的应用到各种数据表格.对于在PPT中插入表格,我发现了一个新方法,不过我用到了一款免费的.NET ...

  8. 数据字典的设计--3.首页添加删除表格（JS实现）

    页面效果: JS代码: 1.添加表格 function insertRows(){ //获取表格对象 var tb1 = $("#dictTbl"); var tempRow = ...

  9. javascript生成表格增删改查 JavaScript动态改变表格单元格内容 动态生成表格 JS获取表格任意单元格 javascript如何动态删除表格某一行

    jsp页面表格布局Html代码 <body onload="show()"> <center> <input type="text" ...

随机推荐

  1. Python与Hack之Unix口令

    1.在实验时候,先导入crypt库:必须在Unix环境下才能实现这个模块 2.代码贴一下,以后有了Unix环境试试吧: import cryptimport syssys.modules['Crypt ...

  2. node read file fs

    var fs = require("fs") fs.readFile("file.txt","UTF-8",function(err,dat ...

  3. The Unique MST（次小生成树）

    Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 22335   Accepted: 7922 Description Give ...

  4. bootstrap datetimepicker 中只显示年或者只显示月份

    1.只显示datetimepicker  日历中只显示年份 $("#day-access-calendar").datepicker({ startView: 2, maxView ...

  5. 找规律 Codeforces Round #290 (Div. 2) A. Fox And Snake

    题目传送门 /* 水题 找规律输出 */ #include <cstdio> #include <iostream> #include <cstring> #inc ...

  6. soapui中文操作手册(二)----通过您的WSDL请求创建一个测试

      1.通过您的WSDL请求创建一个测试 点击加号旁边的导航拓展项目树的Web服务,并选择请求: 在SoapUI Pro中,所述请求编辑出现在右边.SoapUI Pro有一个编辑器,它简化了XML的层 ...

  7. BZOJ2040 : [2009国家集训队]拯救Protoss的故乡

    以根为原点,所有叶子为汇点建立网络. 对于一条边$(x,y,A,B)$,$x$向$y$连边,容量$A$,费用0,再连边,容量$B-A$,费用1. 然后不断增广,直到费用达到$M$为止的最大流即为答案. ...

  8. Redis内存缓存系统入门

    网站:http://redis.io/ key-value cache and store    data structure server 1. 服务器端 1.1 安装 下载安装包:http://r ...

  9. HDU 3333 & 主席树

    题意: balabala SOL: 这题用主席树怎么做呢...貌似一模一样...一个一个建n棵的线段树.先把上一棵树复制下来,当a[i]出现过,就把这棵树里的那个位置去掉------一模一样的思维.. ...

  10. div基础

    1. 写在后面的样式优于前面,会把前面的覆盖掉! 2.三角形的造法:width:0; height:0;然后设置border-left   border-right  border-top  bord ...