不太想描述,大家自行理解吧,这样可能记忆会深一点儿~

<script type="text/javascript">
function mergeCells(){
var count = 0;
var oldText = '';
var oldTd;
var count2 = 0;
var oldText2 = '';
var oldTd2;
var isDelete = false;
var trs = document.getElementsByTagName("tr");
for ( var i = 0; i < trs.length; i++) {
var tds = trs[i].getElementsByTagName("td");
if(count == 0){
oldText = tds[0].innerHTML;
oldTd = tds[0];
count = 1;
}else if(oldText != tds[0].innerHTML){
oldTd.rowSpan = count;
oldText = tds[0].innerHTML;
oldTd = tds[0];
count = 1;
}else{
count = count + 1;
tds[0].parentNode.removeChild(tds[0]);
isDelete = true;
}
if(i == trs.length - 1){
oldTd.rowSpan = count;
} /*添加了一个isDelete变量,用于判断是否删除元素*/
if(count2 == 0){
oldText2 = tds[1].innerHTML;
oldTd2 = tds[1];
count2 = 1;
}else if(isDelete){
if(oldText2 != tds[0].innerHTML){
oldTd2.rowSpan = count2;
oldText2 = tds[0].innerHTML;
oldTd2 = tds[0];
count2 = 1;
}else{
count2 = count2 + 1;
tds[1].parentNode.removeChild(tds[0]);
}
isDelete = false;
}else{
if(oldText2 != tds[1].innerHTML){
oldTd2.rowSpan = count2;
oldText2 = tds[1].innerHTML;
oldTd2 = tds[1];
count2 = 1;
}else{
count2 = count2 + 1;
tds[1].parentNode.removeChild(tds[1]);
}
}
if(i == trs.length - 1){
oldTd2.rowSpan = count2;
}
}
}
mergeCells();
</script>

用JavaScript动态实现单元格合并的更多相关文章

  1. PHPWord中文乱码、单元格合并、动态表格模板解决方案合集

    摘要:  最近一个项目开发要用到PHP技术导出Word文档,采用PHPWord插件,版本为0.6.2 beta,CodePlex已停止维护.网上还有另外一个版本的PhpWord,项目类名大小写上略有不 ...

  2. 关于table动态添加数据 单元格合并 数组合并

    var newArr = [ {"BranchID":1,"BranchName":"城二","BranchFullName&qu ...

  3. ExtJS 4.2 Grid组件的单元格合并

    ExtJS 4.2 Grid组件本身并没有提供单元格合并功能,需要自己实现这个功能. 目录 1. 原理 2. 多列合并 3. 代码与在线演示 1. 原理 1.1 HTML代码分析 首先创建一个Grid ...

  4. NPOI 教程 - 2.1单元格合并

    来源:http://liyingchun343333.blog.163.com/blog/static/3579731620091018212990/ 合并单元格在制作表格时很有用,比如说表格的标题就 ...

  5. asp.net使用控件datagrid实现表头单元格合并

    合并的要点: 1.datagid的单元格合并原理是table中tr,td的布局实现; 2.合并的时机实在其datagridcreate事件中实现; 3.认识一个对象TableCellCollectio ...

  6. DataGridView单元格合并

    本文章转载:http://www.cnblogs.com/xiaofengfeng/p/3382094.html 图: 代码就是如此简单 文件下载:DataGridView单元格合并源码 也可以参考: ...

  7. devexpress实现单元格合并以及依据条件合并单元格

    1.devexpress实现单元格合并非常的简单,只要设置属性[AllowCellMerge=True]就可以了,实现效果如下图: 2.但是在具体要求中并非需要所有的相同单元格都合并,可能需要其他的条 ...

  8. SNF快速开发平台MVC-表格单元格合并组件

    1.   表格单元格合并组件 1.1.      效果展示 1.1.1.    页面展现表格合并单元格 图 4.1 1.1.2.    导出excel合并单元格 图 4.2 1.2.      调用说 ...

  9. excel技巧--单元格合并与拆分

    如果要将上图的地区列做成下图的合并单一列: 有如下做法: (以下图表格为例) 1.选择要排序的表格,点击“开始”-->排序和筛选-->自定义排序.在对话框选择“业务项目”进行排序: 2.选 ...

随机推荐

  1. Spark Executor内幕彻底解密:Executor工作原理图、ExecutorBackend注册源码解密、Executor实例化内幕、Executor具体工作内幕

    本课主题 Spark Executor 工作原理图 ExecutorBackend 注册源码鉴赏和 Executor 实例化内幕 Executor 具体是如何工作的 Spark Executor 工作 ...

  2. 【深入理解JAVA虚拟机】第二部分.内存自动管理机制.3.垃圾收集器与内存分配策略

    1.学习目的 当需要排查各种内存溢出. 内存泄漏问题时,当垃圾收集成为系统达到更高并发量的瓶颈时,我们就需要对这些“自动化”的技术实施必要的监控和调节. Java内存运行时区域的各个部分,其中程序计数 ...

  3. Appium的安装-Mac平台(命令行 & dmg)

    其实Appium的安装方式主要有两种: 1)自己安装配置nodejs的环境,然后通过npm进行appium的安装 2)直接下载官网提供的dmg进行安装,dmg里面已经有nodejs的环境和appium ...

  4. SAP Customer Data Cloud(Gigya)的用户搜索实现

    我在Gigya前台根据email搜索,输入一个邮箱地址,回车,在Chrome开发者工具里观察到到后台的网络请求: 这是一个post请求: __RequestVerificationToken 请求体: ...

  5. ASP.NET 页面基本优化.

    一.禁用Browser Link(目前主要用来是刷新vs ide 浏览界面),直接干掉. <!-- Visual Studio Browser Link --> <script ty ...

  6. 大数因式分解 Pollard_rho 算法详解

    给你一个大数n,将它分解它的质因子的乘积的形式. 首先需要了解Miller_rabin判断一个数是否是素数 大数分解最简单的思想也是试除法,这里就不再展示代码了,就是从2到sqrt(n),一个一个的试 ...

  7. Ubuntu14.04.3,apt-get出现dpkg: error processing package xxx (--configure)和cups-daemon错误的解决方案

    Ubuntu14.04.3,使用apt-get安装软件的时候,报个莫名其妙的错误: dpkg: error processing package xxx (--configure): balabala ...

  8. Python Django 分页

    Python Django 分页 http://www.360doc.com/content/14/0721/17/16044571_396090985.shtml

  9. SQL rownum的用法

    rownum只显示两行记录,第一行是字段名,第二行是满足查询条件的记录.

  10. 关于PHP中的 serialize () 和 unserialize () 的使用(即关于PHP中的值与已存储的表示的相互转换)

    有时,我们会碰到这样的数据(字符串) a:3:{i:0;s:44:"/Uploads/images/2017-07-21/5971a9a08ad57.png";i:1;s:44:& ...