JS 实现Table相同行的单元格自动合并示例代码


Posted in Javascript onAugust 27, 2013

代码如下,可直接运行:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<META NAME="Generator" CONTENT="EditPlus"> 
<META NAME="Author" CONTENT=""> 
<META NAME="Keywords" CONTENT=""> 
<META NAME="Description" CONTENT=""> 
</HEAD> 
<SCRIPT LANGUAGE="JavaScript"> 
function autoRowSpan(tb,row,col) 
{ 
var lastValue=""; 
var value=""; 
var pos=1; 
for(var i=row;i<tb.rows.length;i++){ 
value = tb.rows[i].cells[col].innerText; 
if(lastValue == value){ 
tb.rows[i].deleteCell(col); 
tb.rows[i-pos].cells[col].rowSpan = tb.rows[i-pos].cells[col].rowSpan+1; 
pos++; 
}else{ 
lastValue = value; 
pos=1; 
} 
} 
} </SCRIPT> 
<BODY onload="autoRowSpan(tb,0,0)"> 
<TABLE id="tb" border="1"> 
<THEAD> 
<TR > 
<TD>国家</TD> 
<TD>地区</TD> 
</TR> 
</THEAD> 
<TR> 
<TD>中国</TD> 
<TD>河南</TD> 
</TR> 
<TR> 
<TD>中国</TD> 
<TD>四川</TD> 
</TR> 
<TR> 
<TD>中国</TD> 
<TD>北京</TD> 
</TR> 
<TR> 
<TD>美国</TD> 
<TD>纽约</TD> 
</TR> 
<TR> 
<TD>美国</TD> 
<TD>洛杉矶</TD> 
</TR> 
<TR> 
<TD>英国</TD> 
<TD>伦敦</TD> 
</TR> 
</TABLE> 
</BODY> 
</HTML>
Javascript 相关文章推荐
jQuery前台数据获取实现代码
Mar 16 Javascript
javascript中注册和移除事件的4种方式
Mar 20 Javascript
js简单实现HTML标签Select联动带跳转
Oct 23 Javascript
javascript中文本框中输入法切换的问题
Dec 10 Javascript
Javascript学习笔记之函数篇(六) : 作用域与命名空间
Nov 23 Javascript
jQuery基础知识点总结(必看)
May 31 Javascript
JavaScript中子对象访问父对象的方式详解
Sep 01 Javascript
基于JQuery和原生JavaScript实现网页定位导航特效
Apr 03 jQuery
js实现图片旋转 js滚动鼠标中间对图片放大缩小
Jul 05 Javascript
详解vue.js之props传递参数
Dec 12 Javascript
微信小程序使用gitee进行版本管理
Sep 20 Javascript
Vue插槽_特殊特性slot,slot-scope与指令v-slot说明
Sep 04 Javascript
Javascript 浮点运算的问题分析与解决方法
Aug 27 #Javascript
js中点击空白区域时文本框与隐藏层的显示与影藏问题
Aug 26 #Javascript
关于IE中getElementsByClassName不能用的问题解决方法
Aug 26 #Javascript
关于Jquery操作Cookie取值错误的解决方法
Aug 26 #Javascript
jquery弹出框的用法示例(2)
Aug 26 #Javascript
jquery弹出框的用法示例(一)
Aug 26 #Javascript
jQuery快速上手:写jQuery与直接写JS的区别详细解析
Aug 26 #Javascript
You might like
使用XDebug调试及单元测试覆盖率分析
2011/01/27 PHP
Thinkphp3.2实用篇之计算型验证码示例
2017/02/09 PHP
在php的yii2框架中整合hbase库的方法
2018/09/20 PHP
实现点击列表弹出列表索引的两种方式
2013/03/08 Javascript
js控制不同的时间段显示不同的css样式的实例代码
2013/11/04 Javascript
Node.js的特点和应用场景介绍
2014/11/04 Javascript
jQuery实现HTML5 placeholder效果实例
2014/12/09 Javascript
完美兼容各大浏览器的jQuery插件实现图片切换特效
2014/12/12 Javascript
js对字符的验证方法汇总
2015/02/04 Javascript
轻松学习jQuery插件EasyUI EasyUI创建CRUD应用
2015/11/30 Javascript
Vue.js每天必学之内部响应式原理探究
2016/09/07 Javascript
JS中如何实现复选框全选功能
2016/12/19 Javascript
jQuery插件ajaxFileUpload使用详解
2017/01/10 Javascript
vue mint-ui tabbar变组件使用
2018/05/04 Javascript
python里对list中的整数求平均并排序
2014/09/12 Python
Python3通过Luhn算法快速验证信用卡卡号的方法
2015/05/14 Python
浅析Python 中整型对象存储的位置
2016/05/16 Python
python中numpy包使用教程之数组和相关操作详解
2017/07/30 Python
python中的字典操作及字典函数
2018/01/03 Python
判断python字典中key是否存在的两种方法
2018/08/10 Python
CentOS 7 安装python3.7.1的方法及注意事项
2018/11/01 Python
python中字典按键或键值排序的实现代码
2019/08/27 Python
python爬虫可以爬什么
2020/06/16 Python
选购国际女性时装设计师品牌:IFCHIC(支持中文)
2018/04/12 全球购物
巴西体育用品商店:Lojão dos Esportes
2018/07/21 全球购物
C#可否对内存进行直接的操作
2015/02/26 面试题
区域销售经理职责
2013/12/22 职场文书
物流专业大学的自我评价
2014/01/11 职场文书
企业精细化管理实施方案
2014/03/23 职场文书
小学英语教师先进事迹
2014/05/28 职场文书
机关党建工作汇报材料
2014/08/20 职场文书
教师党员批评与自我批评发言稿
2014/10/15 职场文书
2014年法制宣传日活动方案
2014/11/02 职场文书
紧急迫降观后感
2015/06/15 职场文书
2016年清明节红领巾广播稿
2015/12/17 职场文书
演讲开头怎么书写?
2019/08/06 职场文书