html怎么复制一行,js实现复制,删除一行div或一行table
在网上看到一段通过对节点的控制增加或删除一行table的代码如下:
无标题文档
//给table增加一行
function addTableRow() {
var table1 = document.getElementById('table1');
var cloneTab = document.getElementById('table2');
//alert(cloneTab.firstChild.firstChild.innerHTML);
//alert(cloneTab.firstChild.firstChild.cloneNode(true).innerHTML);
table1.firstChild.appendChild(cloneTab.firstChild.firstChild.cloneNode(true));
var v= table1.firstChild.childNodes;
var len = v.length;
for(var i=1;i
v[i].childNodes[0].firstChild.id=i;//给第一个单元格id赋值
}
}
//给table删除一行
function delTableRow(){
var table1 = document.getElementById('table1');
var isChecked = document.getElementsByName('isChecked');
var len = isChecked.length;
for(var i=len-1;i>=0;i--){
if(isChecked[i].checked==true){
table1.firstChild.removeChild(isChecked[i].parentNode.parentNode);
//alert(isChecked[i].id);
//alert(isChecked[i].parentNode.parentNode.innerHTML);
}
}
}
0 | 00 | 1 | 2 | 3 | 4 | 5 | 6 |
---|
请选择... 1 1 |
---|
因为我用的是div+css,所以将上面的代码改成如下:
无标题文档
.box_quantity_box{ width:250px;
border:1px solid #7a4e25;
font-size:12px;
}
.box_quantity_top{background:#7a4e25;
color:#fefdfb;
width:100%;
height:30px;
}
.box_quantity_con{width:100%;
background:#fef0e5;
height:50px;
}
.box_quantity_ul{ list-style:none;
margin:0px;
padding:0px;
clear:both;
}
.box_quantity_li1{ float:left;
width:60px;
margin:8px 0px 0px 0px;
padding:0px;
text-align:center;
}
.box_quantity_li2{ float:left;
width:30px;
margin:8px 0px 0px 0px;
padding:0px;
text-align:center;
}
.txt1{width:55px;
background:#fef0e5;
border:1px solid #7a4e25;
height:15px;
font-size:12px;
color:#7a4e25;
}
.selecsty1{ width:50px;
background:#fef0e5;
border:1px solid #7a4e25;
height:15px;
font-size:12px;
color:#7a4e25;
}
.singlesty{background:#fef0e5;
color:#7a4e25;
}
.close{clear:both;}
.box_quantity_button {
border:1px solid #7a4e25;
width:47px;
height:17px;
background:#fefdfb;
color:#7a4e25;
cursor:pointer;
}
//给table增加一行
function addTableRow() {
var table1 = document.getElementById('table1');
var cloneTab = document.getElementById('table2');
alert(cloneTab.firstChild.firstChild.innerHTML);
alert(cloneTab.firstChild.firstChild.cloneNode(true).innerHTML);
/* table1.firstChild.appendChild(cloneTab.firstChild.firstChild.cloneNode(true)); */
table1.firstChild.appendChild(cloneTab.firstChild.cloneNode(true));
var v= table1.firstChild.childNodes;
var len = v.length;
for(var i=1;i
v[i].childNodes[0].firstChild.id=i;//给第一个单元格id赋值
}
}
//给table删除一行
function delTableRow(){
var table1 = document.getElementById('table1');
var isChecked = document.getElementsByName('isChecked');
var len = isChecked.length;
for(var i=len-1;i>=0;i--){
if(isChecked[i].checked==true){
table1.firstChild.removeChild(isChecked[i].parentNode.parentNode);
//alert(isChecked[i].id);
//alert(isChecked[i].parentNode.parentNode.innerHTML);
}
}
}
- 操作
- 哈哈1
- 哈哈2
- 哈哈3
- 哈哈4
新增
删除
呵呵
哈哈
啦啦
1
2
3
html怎么复制一行,js实现复制,删除一行div或一行table相关推荐
- 在node.js中复制文件的最快方法
本文翻译自:Fastest way to copy file in node.js Project that I am working on (node.js) implies lots of ope ...
- 程序员们注意了,警惕JS代码复制陷阱
程序员们在日常的编程工作中,难免会在网上查找资料.复制一些现成代码使用. 这是很习惯性的操作,但有危险隐含其中,需要提高警惕. 比如,看看下面的操作是不是很神奇: 如上所示,复制了一行JS代码,但粘贴 ...
- js实现复制文本内容到剪切板
js实现复制文本内容到剪切板 一.总结 一句话总结:就是document的execCommand('copy')方法 二.js实现复制文本内容到剪切板 直接上代码: 1 <script type ...
- 【转】js实现复制到剪贴板功能,兼容所有浏览器
2019独角兽企业重金招聘Python工程师标准>>> 两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家 ...
- 禁止页面复制功能 js禁止复制 禁用页面右键菜单
<body οncοntextmenu="return false">禁用网页右键菜单,但是仍然可以使用快捷键复制. js代码禁用复制功能: <script t ...
- firefox 复制文本js代码。判断窗口是关闭还是刷新
判断窗口是关闭还是刷新 <script> function window.onbeforeunload(){ with(window.event)if(clientY<0&am ...
- js深度复制一个对象使用JSON.stringify是最好的办法吗
转载自 js深度复制一个对象使用JSON.stringify是最好的办法吗 深度复制一个对象,看到很多种方法,最简单的是: var newObject = JSON.parse(JSON.stri ...
- js实现复制html页面
js实现复制html页面 复制html <h5>一.单选题请选择</h5><div class="pojo"><h7>1.fajfa ...
- 【javascript】js实现复制、粘贴
使用document.ExecCommand("copy")命令,官方文档,点我. 例如: <!DOCTYPE html> <html> <head& ...
最新文章
- linux高性能网络编程,Linux高性能网络编程的介绍
- outlook 突然发信不正常
- java爬虫问题二: 使用jsoup爬取数据class选择器中空格多选择怎么解决
- linux cut 命令(转)
- nacos mysql8.0修改
- java开启一个线程_【jdk源码分析】java多线程开启的三种方式
- python怎么读取excel-python读写excel文件
- 【java】程序初始化顺序
- c++在数组中添加元素_LeetCode 题解 | 1157. 子数组中占绝大多数的元素
- 易筋SpringBoot 2.1 | 第十篇:SpringBoot使用thymeleaf入门
- 图片放大以后不清晰怎么办?
- 电脑卡住了怎么保存excel_“表格保存不了怎么办“电脑卡死excel怎么保存
- 深入理解android虚拟机
- 借了你的爱,用我一辈子来还
- 这些道理不懂,你注定就是穷打工的命
- 软工专硕考研_03 2018年考研经验贴:西安交通大学软件工程专硕
- 利用SwipeRefreshLayout实现类似知乎客户端的一打开界面就自动刷新的效果
- 计算机网络基础知识总结及思维导图(一)概述
- openGauss 准备软硬件安装环境
- 离散题目10(判断是否为满射函数 )
热门文章
- 白加黑木马拆分HTTP协议躲避网络单包侦测
- 火车头采集器V10下载-火车头采集器免费
- Java程序员开发两年月薪15k和30K的程序员差距在哪里?
- 创造与魔法服务器维护后必刷鸟吗,创造与魔法云斑鹦鸟位置必刷点2020 刷新时间和地点介绍...
- java.lang.UnsupportedOperationException: Currently Flink doesn‘t support individual window table-val
- 使用leaflet仿原神提瓦特大地图制作日记
- python正则表达式替换excel_在 Excel 中使用正则表达式进行查找与替换
- Accumulation Degree题解
- 网络运营推广具体做什么工作
- js实现不同城市空气质量报告显示柱形图