<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. C# 词法分析器（七）总结

    系列导航 (一)词法分析介绍 (二)输入缓冲和代码定位 (三)正则表达式 (四)构造 NFA (五)转换 DFA (六)构造词法分析器 (七)总结 在之前的六篇文章中,我比较详细的介绍了与词法分析器相 ...

  2. 请将 php.ini 中的 short_open_tag 设置为 On，否则无法继续安装。

    安装的wamp套件,访问http://localhost/Discuz/install/index.PHP进行安装操作,提示 对不起,请将 php.ini 中的 short_open_tag 设置为 ...

  3. HDU4080 Stammering Aliens（二分 + 后缀数组）

    题目 Source http://acm.hdu.edu.cn/showproblem.php?pid=4080 Description Dr. Ellie Arroway has establish ...

  4. 自定义UICollectionViewLayout之瀑布流

    目标效果 因为系统给我们提供的 UICollectionViewFlowLayout 布局类不能实现瀑布流的效果,如果我们想实现 瀑布流 的效果,需要自定义一个 UICollectionViewLay ...

  5. iOS之06-三大特性之继承

    继承 1.定义 继承是指一个对象直接使用另一对象的属性和方法. 继承:xx 是 xxx 2.实现 A { int _age; int _no; } B : A {// 继承的实现 int _weigh ...

  6. linux 安装vbox增强工具

    首先在虚拟机控制台点设备--------安装增强功能,这样会用虚拟光驱加载增强功能镜象. 然后打开终端,先转到root身份:＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝su＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ f ...

  7. BZOJ3424 : Poi2013 Multidrink

    详细做法以及证明请看论文<Hamiltonian paths in the square of a tree>. 首先将1到n的路径提取出来,作为主干. 定义毛毛虫为去掉叶子之后只有一条单 ...

  8. ROW_NUMBER() OVER函数的基本用法

    转自:http://www.cnblogs.com/icebutterfly/archive/2009/08/05/1539657.html 语法:ROW_NUMBER() OVER(PARTITIO ...

  9. URAL 1303. Minimal Coverage(DP)

    题目链接 又是输出路径...这题完全受上题影响,感觉两个题差不多..用了基本上一样的算法写了,这题比较纠结,就是卡内存啊...5000*5000的数组开不了..然后没办法,水了好几次MLE,看了一下虎 ...

  10. /var文件系统

    /var文件系统  /var 包括系统一般运行时要改变的数据.每个系统是特定的,即不通过网络与其他计算机共享.   /var/catman    当要求格式化时的man页的cache.man页的源文件 ...