js动态控制表单表格,这里操作只讲,添加一行,删除一行,删除某一行某一列。

直接放代码:

<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title></title>
</head> <body>
<table id="tabl" border=1 cellpadding=10 cellspacing=0>
<thead bgcolor="#00B3FF">
<tr>
<td>姓名</td>
<td>联系方式</td>
</tr>
</thead>
<tbody>
<tr>
<td>孟小伟</td>
<td>686898</td>
</tr>
<tr>
<td>静妹妹</td>
<td>686898</td>
</tr>
<tr>
<td>臭猪 </td>
<td>686898</td>
</tr>
</tbody>
</table>
<!--表单基础特别举例-->
<form>
<!--这里有个有趣的东西,for=“cao” ,然后后面的<input />添加id为cao,你点击这里的文字,会在input直接提示你输入-->
<p><label for="cao">名字是什么,点击我就可以到框框里面:</label><input type="text" id="cao" /></p>
</form>
<script>
window.onload = function() {
/*创建一行,执行chuang()函数*/
chuang();
/*删除一行,或者某一行一列,执行dete函数*/
dete();
function chuang() {
var tab = document.getElementById("tabl");/*取到要操作的对象*/
var tr = tab.insertRow(2);/*给其添加序号为2的行*/
var Ptext = new Array();/*创建文本节点组数*/
Ptext[0] = document.createTextNode("黑猪");
Ptext[1] = document.createTextNode("998342");
for(var i = 0; i < Ptext.length; i++) {/*遍历*/
var cd = tr.insertCell(i);/*按序号创建列*/
cd.appendChild(Ptext[i]);/*把文本节点添加到对应的列*/
}
}
function dete(){
var tab = document.getElementById("tabl");
tab.deleteRow(4);/*删除一行*/
tab.rows[3].deleteCell(1);/*删除某一行某一列*/
} }
</script>
</body> </html>

  

js动态控制表单表格的更多相关文章

  1. js验证表单大全

    js验证表单大全 1. 长度限制 <script> function test() { if(document.a.b.value.length>50) { alert(" ...

  2. JS 更改表单的提交时间和Input file的样式

    JS转换时间 function renderTime(data) { var da = eval('new ' + data.replace('/', '', 'g').replace('/', '' ...

  3. jquery.form.js 让表单提交更优雅

    jquery.form.js 让表单提交更优雅.可以页面不刷新提交表单,比jQuery的ajax提交要功能强大. 1.引入 <script src="/src/jquery-1.9.1 ...

  4. Vue.js:表单

    ylbtech-Vue.js:表单 1.返回顶部 1. Vue.js 表单 这节我们为大家介绍 Vue.js 表单上的应用. 你可以用 v-model 指令在表单控件元素上创建双向数据绑定. v-mo ...

  5. 利用JS提交表单的几种方法和验证(必看篇)

    第一种方式:表单提交,在form标签中增加onsubmit事件来判断表单提交是否成功 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 <scr ...

  6. jquery.validate.js 验证表单时,在IE当中未验证就直接提交的原因

    jquery.validate.js 验证表单时,在IE当中未验证就直接提交的原因 今天利用了jquery.validate.js来验证表单,发现在火狐.谷歌浏览器当中都可以进行验证,但是在IE系列浏 ...

  7. ★★★【卡法 常用js库】: js汇合 表单验证 cookie设置 日期格式 电话手机号码 email 整数 小数 金额 检查参数长度

    [卡法 常用js库]: js汇合 表单验证  cookie设置  日期格式  电话手机号码  email  整数  小数  金额   检查参数长度 // +---------------------- ...

  8. JS form表单提交的方法

    1.当输入用户名和密码为空的时候,需要判断.这时候就用到了校验用户名和密码,这个需要在jsp的前端页面写:有两种方法,一种是用submit提交.一种是用button提交.方法一: 在jsp的前端页面的 ...

  9. HTML 学习笔记 JQuery(表单,表格 操作)

    表单应用 一个表单有3个基本组成部分 (1)表单标签:包含处理表单数据所用的服务器端程序URL 以及数据提交到服务器的方法 (2)表单域:包含文本框 密码框 隐藏框 多行文本框 复选框 单选框 下拉选 ...

随机推荐

  1. MySQL程序端启动密码错误解决方法

    MySQL程序端启动密码错误解决方法 一般启动MySQL程序端,都是用mysql -uroot -p命令,当然前提是你的环境变量已经配好了. 为了连接服务器,当调用mysql时,通常需要提供一个MyS ...

  2. 采用太平洋AI的DINK框架一键运行3D点云识别,一键训练深度学习模型

    DINK安装视频教程:  http://fp-ai.com/video_details.html?id=072b030ba126b2f4b2374f342be9ed44 DINK一键启动视频教程:   ...

  3. python 离散序列 样本数伸缩(原创)

    解决问题: 有一个固定长度的1维矩阵,将这个矩阵的取样点进行扩充和减少 功能函数: def discrete_scale(data, num): import numpy as np import c ...

  4. mysql 开发进阶篇系列 25 数据库RPM安装目录介绍

    一.概述 mysql可以在多个平台上运行,在windows平台上安装有noinstall包和图形化包二种方式.在linux/unix平台上有RPM包安装,二进制包(Binary Package)安装, ...

  5. kaggle-Digit Recognizer

    安装kaggle工具获取数据源(linux 环境) 采用sklearn的KNeighborsClassifier训练数据 通过K折交叉验证来选取K值是正确率更高 1.安装kaggle,获取数据源 pi ...

  6. vue-05-webpack安装-vue单文件启动

    1, webpack是什么 1), 是一个打包工具, 比gulp, grunt更先进 2), 额外功能 项目部署上线, 清空目录等 hot module reload, 页面刷新后, 数据不变化 3) ...

  7. Controller:EOS区块链核心控制器

    Controller是EOS区块链的核心控制器,其功能丰富.责任重大. 关键字:EOS,区块链,controller,chainbase,db,namespace,using,信号槽,fork_dat ...

  8. spring cloud config安全

    前面两篇介绍了spring cloud config服务端和客户端的简单配置,本篇介绍如何保护config server及对应config client修改. 保护config server,主要是使 ...

  9. CentOS7日期时间设置方法以及时间基本概念介绍

    在CentOS 6版本,时间设置有date.hwclock命令,从CentOS 7开始,使用了一个新的命令timedatectl. 一.基本概念 1.1 GMT.UTC.CST.DST 时间 (1) ...

  10. 【Java基础】9、Enumeration接口和Iterator接口的区别

    package java.util; public interface Enumeration<E> {     boolean hasMoreElements();     E next ...