js动态加载数据合并单元格,

代码如下所示,可复制直接运行:

<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<style>td{padding:2px 30px}</style>
</head>
<body>
<script type="text/javascript">
var num =0;
window.onload=function(){
var myData=[
["姓名","年龄","科目"],
['张三','11',"语文"],
['张三','11',"数学"],
['张三','11',"数学"],
['李四','11',"数学"],
['李四','11',"数学"],
['李四','11',"数学"],
['www','11',"数学"],
['www','11',"数学"],
['www','11',"数学"],
['www','11',"数学"]
]
var str="<table border='1' cellspacing='0' cellpadding='0'><tbody>";
var c=0;
for(var i=0; i<myData.length; i++){
if(i > 0) {
if (myData[i][0] == myData[i - 1][0]) {
str+="<tr><td>"+myData[i][1]+"</td><td>"+myData[i][2]+"</td></tr>";
}else {
str+="</tbody>";
str+="<tbody>";
str+="<tr><td rowspan='1000'>"+myData[i][0]+"</td><td>"+myData[i][1]+"</td><td>"+myData[i][2]+"</td></tr>";
}
}else{
str+="<tr><td>"+myData[i][0]+"</td><td>"+myData[i][1]+"</td><td>"+myData[i][2]+"</td></tr>";
}
}
str+='</tbody></table>';
//console.log(str);
document.getElementById("table").innerHTML=str;
}
</script>
<div id="table" ></div>
</body>
</html>

js动态加载数据并合并单元格的更多相关文章

  1. js动态加载数据到文本框指定的位置

    html代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...

  2. [JS前端开发] js/jquery控制页面动态加载数据 滑动滚动条自动加载事件

    页面滚动动态加载数据,页面下拉自动加载内容 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样的效果:进入qq空间,向下拉动空 ...

  3. js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的

    js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样 ...

  4. js实现滚动条来动态加载数据

    主要angular2+es6 data:Array<any> //展示的数据 allData:Array<any> //全部的数据 size:number = 10 //每次动 ...

  5. 微信小程序(五) 利用模板动态加载数据

    利用模板动态加载数据,其实是对上一节静态数据替换成动态数据:

  6. mui 动态加载数据出现的问题处理 (silder轮播组件 indexedList索引列表 下拉刷新不能继续加载数据)

    mui-slider 问题:动态给mui的图片轮播添加图片,轮播不滚动. 解决:最后把滚动轮播图片的mui(".mui-slider").slider({interval: 300 ...

  7. 爬虫--selenuim和phantonJs处理网页动态加载数据的爬取

    1.谷歌浏览器的使用 下载谷歌浏览器 安装谷歌访问助手 终于用上谷歌浏览器了.....激动 问题:处理页面动态加载数据的爬取 -1.selenium -2.phantomJs 1.selenium 二 ...

  8. 页面加载异常 清除浏览器静态文件 js css 缓存 js动态加载js css文件,可以配置文件后辍,防止浏览器缓存

    js清除浏览器缓存的几种方法 - 兔老霸夏 - 博客园 https://www.cnblogs.com/Mr-Rocker/p/6031096.html js清除浏览器缓存的几种方法   一.CSS和 ...

  9. 爬虫开发6.selenuim和phantonJs处理网页动态加载数据的爬取

    selenuim和phantonJs处理网页动态加载数据的爬取阅读量: 1203 动态数据加载处理 一.图片懒加载 什么是图片懒加载? 案例分析:抓取站长素材http://sc.chinaz.com/ ...

随机推荐

  1. Values & Reference:值和引用

    var a = 2; var b = a; //b 是 a 的值的一个副本 b++; a; b; var c = [1, 2, 3]; var d = c; // d 是 值[1, 2, 3]的一个引 ...

  2. JQuery button控制div或者section

    一.项目你需求 点击左边导航栏的某个按钮,右边内容栏显示出,相应的内容 效果如图   二.html与css.jQuery 1.div模式 <!DOCTYPE html PUBLIC " ...

  3. Alpha 冲刺 (6/10

    Alpha 冲刺 (6/10) 队名:第三视角 组长博客链接 本次作业链接 团队部分 团队燃尽图 工作情况汇报 张扬(组长) 过去两天完成了哪些任务: 文字/口头描述: 1.组织会议 2.帮助队员解决 ...

  4. 7.5 C++基本序列式容器

    参考:http://www.weixueyuan.net/view/6402.html 总结: vector可以理解为可以在两端插入.删除数据的数组,它提供了丰富的成员函数,用于操作数据. begin ...

  5. SQL-4查找所有已经分配部门的员工的last_name和first_name(自然连接)

    题目描述 查找所有已经分配部门的员工的last_name和first_nameCREATE TABLE `dept_emp` (`emp_no` int(11) NOT NULL,`dept_no` ...

  6. html回顾随笔JS(*^__^*)

    ---恢复内容开始--- map遍历 function b(){ var week = new Map(); week.set("Mon","星期一"); we ...

  7. VCL界面控件DevExpress VCL Controls发布v18.2.5|附下载

    DevExpress VCL Controls是 Devexpress公司旗下最老牌的用户界面套包.所包含的控件有:数据录入,图表,数据分析,导航,布局,网格,日程管理,样式,打印和工作流等,让您快速 ...

  8. powerdesigner导出sql时报错 Generation aborted due to errors detected during the verification of the model.

    powerdesigner导出sql时报错 Generation aborted due to errors detected during the verification of the model ...

  9. JavaScript作用域及作用域链详解、声明提升

    相信大家在入门JavaScript这门语言时对作用域.作用域链.变量声明提升这些概念肯定会稀里糊涂,下面就来说说这几个 Javascript 作用域 在 Javascript 中,只有局部作用域和全局 ...

  10. 网站如何实现 在qq中发自己链接时,便自动获取链接标题、图片和部分内容

    如何实现像这种效果?答案如下(要采用分享的形式,复制链接有可能会实现不了效果,至少我的测试是这样的) <head>标签内有QQ专有的标签可以控制要注意QQ的缓存机制,对同一个链接,修改后可 ...