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. Codeforces Round #499 (Div. 2) C. Fly(数学+思维模拟)

    C. Fly time limit per test 1 second memory limit per test 256 megabytes input standard input output ...

  2. Java学习笔记28（集合框架二：Iterator迭代器）

    Iterator接口,翻译成中文是迭代器 迭代器的概念通俗解释: java中有很多的集合,内部有各种存储方法,取出的方式也各不相同,是否可以有一种通用的方式来获取呢? 这种方式类似for循环遍历, 通 ...

  3. Swift5 语言指南(十七) 反初始化

    一个deinitializer一个类的实例被释放之前立即调用.您使用deinit关键字编写deinitializers ,类似于使用init关键字编写初始化程序的方式.Deinitializers仅适 ...

  4. C#6.0语言规范(三) 基本概念

    应用程序启动 具有入口点的程序集称为应用程序.运行应用程序时,会创建一个新的应用程序域.应用程序的几个不同实例可以同时存在于同一台机器上,并且每个实例都有自己的应用程序域. 应用程序域通过充当应用程序 ...

  5. 如何在cygwin中运行crontab定时脚本[利刃篇]

    用到cygwin,自然是希望能多处理一些类似linux的任务了,那就自然少不了定时任务crontab,看到网上教程不少,自己运行一个测试却也不那么容易,下面就记录我的安装过程,以供参考吧! 1.首先, ...

  6. Bootstrap 3的box-sizing样式导致UMeditor控件的图片无法正常缩放

    UMeditor组件是百度提供的一套开源的web在线所见即所得富文本编辑器,是UEditor的简化版,UM的主要特点就是容量和加载速度上的改变,主文件的代码量为139k,而且放弃了使用传统的ifram ...

  7. Dispatch Queue 之 dispatch_sync

    

  8. IDEA的maven配置

    刚接触maven的时候,也知道maven目录下有个setting文件可以设置远程maven库的地址,但自己实践的时候,发现setting文件的地址都被注释掉了,但是jar包还是能成功下载下来,那这个下 ...

  9. JSTL-简介

    JSTL全称为 JSP Standard Tag Library 即JSP标准标签库. JSTL作为最基本的标签库,提供了一系列的JSP标签,实现了基本的功能:集合的遍历.数据的输出.字符串的处理.数 ...

  10. 【xsy2303】呀 dp

    题目大意:你需要构造一个长度为$n$的排列$A$,使得里面包含有子序列$B$(子序列$B$为一个给定的$1$到$m$的排列),且对于每个$i$,有$A[A[i]]=i$,问有多少种方案方案. 数据范围 ...