JS/jQuery如何实现超简单的Table表格添加,删除行功能-创新互联

小编给大家分享一下JS/jQuery如何实现超简单的Table表格添加,删除行功能，希望大家阅读完这篇文章之后都有所收获，下面让我们一起去探讨吧！

为罗江等地区用户提供了全套网页设计制作服务，及罗江网站建设行业解决方案。主营业务为网站建设、网站设计、罗江网站设计，以传统方式定制建设网站，并提供域名空间备案等一条龙服务，秉承以专业、用心的态度为用户提供真诚的服务。我们深信只要达到每一位用户的要求，就会得到认可，从而选择与我们长期合作。这样，我们也可以走得更远！

本文实例讲述了JS/jQuery实现超简单的Table表格添加,删除行功能。分享给大家供大家参考，具体如下：

    



    
        性别
        姓名
        年龄
    
    
        
            
              男
              女
            
        
        
            
        
        
            
        
    

//动态添加行
function addRow(){
  var table = document.getElementById("tableID");
  var newRow = table.insertRow(); //创建新行
  var newCell1 = newRow.insertCell(); //创建新单元格
  newCell.innerHTML = ""； //单元格内的内容
  newCell.setAttribute("align","center"); //设置位置
}
//动态删除行
function deleteRow(){
  var rowIndex = event.srcElement.parentElement.parentElement.rowIndex;
  var styles = document.getElementById("tableID");
  styles.deleteRow(rowIndex);
}

用克隆的方式

var index = 0;
$(document).ready(function(){
 $("button").click(function(){
 index++;
  $("body").append($("p").clone().attr({'id':'name'+index,'name':'pwd'+index}));
 });
});



This is a paragraph.
复制每个 p 元素，然后追加到 body 元素

下面是直接添加和删除当前table表格,很好用

 
  " rel="external nofollow" >
    
    
    
    
    
    
  
 
 
  添加
  显示
  
 

    var index = 0;
    var a = function(){
        index++;
        var tab = "";
        tab += "尺寸规格";
        tab += "长度宽度数量(个)";
        tab += "摆放区域单个面积(平方米)总面积";
        tab += "内容描述";
        tab += "";
        $('#tab').append(tab);
    }
    function del(ind){
        $('#tab_'+ind).remove();
    }
    function b(ind){
        var cdd = $('#cd_'+ind).val();
        var kdd = $('#kd_'+ind).val();
        if(cdd==''){cdd = 1;}
        if(kdd==''){kdd = 1;}
        if(cdd==''&&kdd==''){
            $('#dgmj_'+ind).val('');
        }else{
            $('#dgmj_'+ind).val(cdd * kdd);
        }
    }
    function c(ind){
        var cdd = $('#cd_'+ind).val();
        var kdd = $('#kd_'+ind).val();
        var sll = $('#sl_'+ind).val();
        if(cdd==''){cdd = 1;}
        if(kdd==''){kdd = 1;}
        if(sll==''){sll = 1;}
        if(cdd==''&&kdd==''&&sll==''){
            $('#zmj_'+ind).val('');
        }else if(cdd!=''&&kdd!=''&&sll!=''){
            $('#zmj_'+ind).val(cdd * kdd * sll);
        }else{
            $('#zmj_'+ind).val('');
        }
    }

JavaScript是什么

JS是JavaScript的简称，它是一种直译式的脚本语言，其解释器被称为JavaScript引擎，是浏览器的一部分，主要用于web的开发，可以给网站添加各种各样的动态效果，让网页更加美观。

看完了这篇文章，相信你对“JS/jQuery如何实现超简单的Table表格添加,删除行功能”有了一定的了解，如果想了解更多相关知识，欢迎关注创新互联行业资讯频道，感谢各位的阅读！

网站标题：JS/jQuery如何实现超简单的Table表格添加,删除行功能-创新互联
文章出自：http://bzwzjz.com/article/cogdch.html