在网上看到一段通过对节点的控制增加或删除一行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相关推荐

  1. 在node.js中复制文件的最快方法

    本文翻译自:Fastest way to copy file in node.js Project that I am working on (node.js) implies lots of ope ...

  2. 程序员们注意了,警惕JS代码复制陷阱

    程序员们在日常的编程工作中,难免会在网上查找资料.复制一些现成代码使用. 这是很习惯性的操作,但有危险隐含其中,需要提高警惕. 比如,看看下面的操作是不是很神奇: 如上所示,复制了一行JS代码,但粘贴 ...

  3. js实现复制文本内容到剪切板

    js实现复制文本内容到剪切板 一.总结 一句话总结:就是document的execCommand('copy')方法 二.js实现复制文本内容到剪切板 直接上代码: 1 <script type ...

  4. 【转】js实现复制到剪贴板功能,兼容所有浏览器

    2019独角兽企业重金招聘Python工程师标准>>> 两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家 ...

  5. 禁止页面复制功能 js禁止复制 禁用页面右键菜单

    <body οncοntextmenu="return false">禁用网页右键菜单,但是仍然可以使用快捷键复制. js代码禁用复制功能: <script  t ...

  6. firefox 复制文本js代码。判断窗口是关闭还是刷新

    判断窗口是关闭还是刷新  <script>  function window.onbeforeunload(){  with(window.event)if(clientY<0&am ...

  7. js深度复制一个对象使用JSON.stringify是最好的办法吗

    转载自   js深度复制一个对象使用JSON.stringify是最好的办法吗 深度复制一个对象,看到很多种方法,最简单的是: var newObject = JSON.parse(JSON.stri ...

  8. js实现复制html页面

    js实现复制html页面 复制html <h5>一.单选题请选择</h5><div class="pojo"><h7>1.fajfa ...

  9. 【javascript】js实现复制、粘贴

    使用document.ExecCommand("copy")命令,官方文档,点我. 例如: <!DOCTYPE html> <html> <head& ...

最新文章

  1. linux高性能网络编程,Linux高性能网络编程的介绍
  2. outlook 突然发信不正常
  3. java爬虫问题二: 使用jsoup爬取数据class选择器中空格多选择怎么解决
  4. linux cut 命令(转)
  5. nacos mysql8.0修改
  6. java开启一个线程_【jdk源码分析】java多线程开启的三种方式
  7. python怎么读取excel-python读写excel文件
  8. 【java】程序初始化顺序
  9. c++在数组中添加元素_LeetCode 题解 | 1157. 子数组中占绝大多数的元素
  10. 易筋SpringBoot 2.1 | 第十篇:SpringBoot使用thymeleaf入门
  11. 图片放大以后不清晰怎么办?
  12. 电脑卡住了怎么保存excel_“表格保存不了怎么办“电脑卡死excel怎么保存
  13. 深入理解android虚拟机
  14. 借了你的爱,用我一辈子来还
  15. 这些道理不懂,你注定就是穷打工的命
  16. 软工专硕考研_03 2018年考研经验贴:西安交通大学软件工程专硕
  17. 利用SwipeRefreshLayout实现类似知乎客户端的一打开界面就自动刷新的效果
  18. 计算机网络基础知识总结及思维导图(一)概述
  19. openGauss 准备软硬件安装环境
  20. 离散题目10(判断是否为满射函数 )

热门文章

  1. 白加黑木马拆分HTTP协议躲避网络单包侦测
  2. 火车头采集器V10下载-火车头采集器免费
  3. Java程序员开发两年月薪15k和30K的程序员差距在哪里?
  4. 创造与魔法服务器维护后必刷鸟吗,创造与魔法云斑鹦鸟位置必刷点2020 刷新时间和地点介绍...
  5. java.lang.UnsupportedOperationException: Currently Flink doesn‘t support individual window table-val
  6. 使用leaflet仿原神提瓦特大地图制作日记
  7. python正则表达式替换excel_在 Excel 中使用正则表达式进行查找与替换
  8. Accumulation Degree题解
  9. 网络运营推广具体做什么工作
  10. js实现不同城市空气质量报告显示柱形图