js动态控制表单表格
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动态控制表单表格的更多相关文章
- js验证表单大全
js验证表单大全 1. 长度限制 <script> function test() { if(document.a.b.value.length>50) { alert(" ...
- JS 更改表单的提交时间和Input file的样式
JS转换时间 function renderTime(data) { var da = eval('new ' + data.replace('/', '', 'g').replace('/', '' ...
- jquery.form.js 让表单提交更优雅
jquery.form.js 让表单提交更优雅.可以页面不刷新提交表单,比jQuery的ajax提交要功能强大. 1.引入 <script src="/src/jquery-1.9.1 ...
- Vue.js：表单
ylbtech-Vue.js:表单 1.返回顶部 1. Vue.js 表单 这节我们为大家介绍 Vue.js 表单上的应用. 你可以用 v-model 指令在表单控件元素上创建双向数据绑定. v-mo ...
- 利用JS提交表单的几种方法和验证(必看篇)
第一种方式:表单提交,在form标签中增加onsubmit事件来判断表单提交是否成功 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 <scr ...
- jquery.validate.js 验证表单时，在IE当中未验证就直接提交的原因
jquery.validate.js 验证表单时,在IE当中未验证就直接提交的原因 今天利用了jquery.validate.js来验证表单,发现在火狐.谷歌浏览器当中都可以进行验证,但是在IE系列浏 ...
- ★★★【卡法 常用js库】： js汇合 表单验证 cookie设置 日期格式 电话手机号码 email 整数 小数 金额 检查参数长度
[卡法 常用js库]: js汇合 表单验证 cookie设置 日期格式 电话手机号码 email 整数 小数 金额 检查参数长度 // +---------------------- ...
- JS form表单提交的方法
1.当输入用户名和密码为空的时候,需要判断.这时候就用到了校验用户名和密码,这个需要在jsp的前端页面写:有两种方法,一种是用submit提交.一种是用button提交.方法一: 在jsp的前端页面的 ...
- HTML 学习笔记 JQuery（表单,表格 操作）
表单应用 一个表单有3个基本组成部分 (1)表单标签:包含处理表单数据所用的服务器端程序URL 以及数据提交到服务器的方法 (2)表单域:包含文本框 密码框 隐藏框 多行文本框 复选框 单选框 下拉选 ...
随机推荐
- python 使用unittest进行单元测试
import unittest import HTMLTestRunner """ Python中有一个自带的单元测试框架是unittest模块,用它来做单元测试,它里面 ...
- 解决“UnicodeEncodeError: 'gbk' codec can't encode character u'\xa9' in position 24051: illegal multibyte sequence”错误
今天我在爬取一个网页时出现了下面这个错误: UnicodeEncodeError: 'gbk' codec can't encode character u'\xa9' in position 240 ...
- PHP中url相关函数
1,string urlencode(string $str)/string urldecode(string $str) urlencode将中文以及特殊字符转化为16进制,然后在每个字符前面加%: ...
- log4j 详细使用教程【转载】
日志是应用软件中不可缺少的部分,Apache的开源项目log4j是一个功能强大的日志组件,提供方便的日志记录.在apache网站:jakarta.apache.org/log4j 可以免费下载到Log ...
- 机器学习基石笔记：11 Linear Models for Classification
一.二元分类的线性模型 线性分类.线性回归.逻辑回归: 可视化这三个线性模型的代价函数, SQR.SCE的值都是大于等于0/1的. 理论分析上界: 将回归应用于分类: 线性回归后的参数值常用于pla/ ...
- Spark架构
Spark架构 为了更好地理解调度,我们先来鸟瞰一下集群模式下的Spark程序运行架构图. 1. Driver Program 用户编写的Spark程序称为Driver Progr ...
- Django2.1发布，Django2.1新特性
Django 2.1 现已正式发布,官方表示随着 2.1 的发布,对 2.0 系列的主流支持服务将结束,进入安全修复服务周期,直至2019年4月. 2.1新特性:https://docs.django ...
- OpenStack 单元测试
OpenStack 单元测试 OpenStack开发——单元测试 本文将介绍OpenStack单元测试的部分.本文将重点讲述Python和OpenStack中的单元测试的生态环境. openstack ...
- DDD实战进阶第一波(四)：开发一般业务的大健康行业直销系统（搭建支持DDD的轻量级框架三）
上一篇文章我们讲了经典DDD架构对比传统三层架构的优势,以及经典DDD架构每一层的职责后,本篇文章将介绍基础结构层中支持DDD的轻量级框架的主要代码. 这里需要说明的是,DDD轻量级框架能够体现DDD ...
- mysql 开发进阶篇系列 24 查询缓存下
一. 查询缓存 1.开启缓存 [root@xuegod64 etc]# vim my.cnf 设置了缓存开启,缓存最大限制128M,重启服务后,再次查询 -- 开启查询缓存后 SHOW VARIABL ...