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 相关文章推荐
javascript encodeURI和encodeURIComponent的比较
Apr 03 Javascript
初窥JQuery(二) 事件机制(1)
Nov 25 Javascript
常用一些Javascript判断函数
Aug 14 Javascript
基于jQuery中对数组进行操作的方法
Apr 16 Javascript
JS实现选中当前菜单后高亮显示的导航条效果
Oct 15 Javascript
作为老司机使用 React 总结的 11 个经验教训
Apr 08 Javascript
jQuery实现下拉菜单的实例代码
Jun 19 jQuery
微信小程序开发教程之增加mixin扩展
Aug 09 Javascript
Vue组件开发技巧总结
Mar 04 Javascript
vue+webpack 更换主题N种方案优劣分析
Oct 28 Javascript
jQuery操作动画完整实例分析
Jan 10 jQuery
Javascript实现打鼓效果
Jan 29 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
Snoopy类使用小例子
2008/04/15 PHP
代码精简的可以实现元素圆角的js函数
2007/07/21 Javascript
33个优秀的 jQuery 图片展示插件分享
2012/03/14 Javascript
推荐17个优美新鲜的jQuery的工具提示插件
2012/09/14 Javascript
JQuery each打印JS对象的方法
2013/11/13 Javascript
js格式化金额可选是否带千分位以及保留精度
2014/01/28 Javascript
js获取checkbox复选框选中的选项实例
2014/08/24 Javascript
JS简单获取客户端IP地址的方法【调用搜狐接口】
2016/09/05 Javascript
Javascript数组中push方法用法分析
2016/10/31 Javascript
微信小程序 动态的设置图片的高度和宽度详解及实例代码
2017/02/24 Javascript
JS实现两周内自动登录功能
2017/03/23 Javascript
VUE元素的隐藏和显示(v-show指令)
2017/06/23 Javascript
浅谈JavaScript find 方法不支持IE的问题
2017/09/28 Javascript
vue 自定义全局方法,在组件里面的使用介绍
2018/02/28 Javascript
JS事件绑定的常用方式实例总结
2019/03/02 Javascript
微信小程序实现手势滑动卡片效果
2019/08/26 Javascript
原生js实现随机点名功能
2019/11/05 Javascript
在vue中阻止浏览器后退的实例
2019/11/06 Javascript
快速了解Vue父子组件传值以及父调子方法、子调父方法
2020/07/15 Javascript
Python爬虫包 BeautifulSoup  递归抓取实例详解
2017/01/28 Python
Python paramiko模块的使用示例
2018/04/11 Python
Python 调用PIL库失败的解决方法
2019/01/08 Python
Python3实现的判断回文链表算法示例
2019/03/08 Python
使用opencv将视频帧转成图片输出
2019/12/10 Python
如何基于Python爬取隐秘的角落评论
2020/07/02 Python
HTML5利用约束验证API来检查表单的输入数据的代码实例
2016/12/20 HTML / CSS
百丽国际旗下购物网站:优购
2017/02/28 全球购物
2014年全国爱牙日宣传活动方案
2014/09/21 职场文书
巾帼文明岗事迹材料
2014/12/24 职场文书
绵山导游词
2015/02/05 职场文书
投诉信范文
2015/07/02 职场文书
同学会演讲稿
2019/04/02 职场文书
springboot+VUE实现登录注册
2021/05/27 Vue.js
详解jQuery的核心函数和事件处理
2022/02/18 jQuery
使用CSS连接数据库的方式
2022/02/28 HTML / CSS
Python 数据可视化工具 Pyecharts 安装及应用
2022/04/20 Python