使用js为表格添加一行
今天同事问了我一个问题，为表格添加新的行，我用的js写了一下，代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
var j=1;
function addtr(){
var tableobj =document.getElementById("tid");
var trobj =document.createElement("tr");
var tdobj = document.createElement("td");
for(var i=0;i<4;i++)
{
var tdobj=document.createElement("td");
tdobj.innerHTML=j++;
trobj.appendChild(tdobj);
}
trobj.appendChild(tdobj);
tableobj.appendChild(trobj);
} </script>
</head>
<body>
<input type="button" value="添加行" onclick="addtr()"> <table border="1" id="tid">
<tr>
<td>A</td>
<td>B</td>
<td>C</td>
<td>D</td>
</tr>
</table>
</body>
</html>
主要是一个appendChild方法。
使用js为表格添加一行的更多相关文章
- 利用jquery表格添加一行并在每行第一列大写字母显示实现方法
表格添加一行并在每行第一列大写字母显示jquery实现方法 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN& ...
- 在网页中动态地给表格添加一行内容--HTML+CSS+JavaScript
需求描述: 用户在页面上点击按钮,可以把文本框中的数据在表格的新的一行中显示,具体表现如下图: 如果如果输入框内容有一项为空,弹出对话框‘请将数据填入完全 步骤: 1.按钮注册单击事件 2.获取并判断 ...
- js Table表格选中一行变色或者多选 并获取值
使用JQ <script> let old, oldColor; $("#sp_body tr").click(function (i) { if (old) oldC ...
- js为表格添加行和列
<table id="studentTable" align="center" border="1px;" cellpadding=& ...
- js隐藏表格的一行数据
1.方法 document.getElementById('customerAccount_tr').style.display="";//缴纳人名称显示 document.get ...
- javascript生成表格增删改查 JavaScript动态改变表格单元格内容 动态生成表格 JS获取表格任意单元格 javascript如何动态删除表格某一行
jsp页面表格布局Html代码 <body onload="show()"> <center> <input type="text" ...
- js实现在表格中删除和添加一行
<!DOCTYPE html><html> <head> <title> new document </title> <meta ht ...
- 点击按钮在表格的某一行下，在添加一行(HTML+JS)
使用js在指定的tr下添加一个新的一行newTr html代码: <table> <tr> <td>用户名:</td> <td><in ...
- js实现表格信息的删除和添加
制作一个表格,显示班级的学生信息. 要求: 1. 鼠标移到不同行上时背景色改为色值为 #f2f2f2,移开鼠标时则恢复为原背景色 #fff 2. 点击添加按钮,能动态在最后添加一行 3. 点击删除按钮 ...
随机推荐
- 阿里云部署JeecgBoot
阿里云部署JeecgBoot 首先贴出官网教程:http://jeecg-boot.mydoc.io/?t=345682 自己在部署的时候遇到了各种各样的问题,其实一步一步的按照官网给出的步骤来是没问 ...
- php实现自定义中间logo的微信小程序码
小程序码生成的时候是默认使用小程序后台设置的小程序icon图片的,但是在有些场景我们可能要替换成我们自己想要的icon. 下面先放代码: public function makeNewQrCodeAc ...
- git&github 的使用
git(/ɡɪt/[5], 音频(帮助·信息))是一个分布式版本控制软件,最初由林纳斯·托瓦兹(Linus Torvalds)创作,于2005年以GPL发布.最初目的是为更好地管理Linux内核开发而 ...
- 更新centos本地仓库（换源）
/etc/yum.repos.d/CentOS-Base.repo 1,首先进行备份 mv /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/Cen ...
- WMITools修复wmi劫持--hao643.com/jtsh123劫持（修改快捷方式跳转至hao123.com）
>症状:所有浏览器快捷方式,都被加上尾巴,例如IE的:"C:\Program Files\Internet Explorer\iexplore.exe" http://hao ...
- 一点点学习PS--实战三
本节实战,练习多张图片合成,调色相饱和度,剪贴蒙版的使用场景,人物内发光,人物轮廓光以及多种图层混合模式的使用,深入了解图层蒙版 1.工具使用 (1)多边形套锁工具:适用于棱角分明的抠图区域,选中了区 ...
- SQL操作DBF
--从SQL Server查询器预览dBase 文件中数据select * from openrowset('MICROSOFT.ACE.OLEDB.12.0','dBase 5.0;database ...
- 快速搭建SSM框架环境开发项目【配置】
maven在线仓库https://mvnrepository.com/ maven构建项目 pom.xml <project xmlns="http://maven.apache.or ...
- C# 元组和值元组
C# 7.0已经出来一段时间了,大家都知道新特性里面有个对元组的优化:ValueTuple.这里利用详尽的例子详解Tuple VS ValueTuple(元组类VS值元组),10分钟让你更了解Valu ...
- 208. 实现 Trie (前缀树)
主要是记录一下这个数据结构. 比如这个trie树,包含三个单词:sea,sells,she. 代码: class Trie { bool isWord; vector<Trie*> chi ...