js动态加载数据并合并单元格
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动态加载数据并合并单元格的更多相关文章
- js动态加载数据到文本框指定的位置
html代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...
- [JS前端开发] js/jquery控制页面动态加载数据 滑动滚动条自动加载事件
页面滚动动态加载数据,页面下拉自动加载内容 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样的效果:进入qq空间,向下拉动空 ...
- js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的
js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样 ...
- js实现滚动条来动态加载数据
主要angular2+es6 data:Array<any> //展示的数据 allData:Array<any> //全部的数据 size:number = 10 //每次动 ...
- 微信小程序(五) 利用模板动态加载数据
利用模板动态加载数据,其实是对上一节静态数据替换成动态数据:
- mui 动态加载数据出现的问题处理 (silder轮播组件 indexedList索引列表 下拉刷新不能继续加载数据)
mui-slider 问题:动态给mui的图片轮播添加图片,轮播不滚动. 解决:最后把滚动轮播图片的mui(".mui-slider").slider({interval: 300 ...
- 爬虫--selenuim和phantonJs处理网页动态加载数据的爬取
1.谷歌浏览器的使用 下载谷歌浏览器 安装谷歌访问助手 终于用上谷歌浏览器了.....激动 问题:处理页面动态加载数据的爬取 -1.selenium -2.phantomJs 1.selenium 二 ...
- 页面加载异常 清除浏览器静态文件 js css 缓存 js动态加载js css文件,可以配置文件后辍,防止浏览器缓存
js清除浏览器缓存的几种方法 - 兔老霸夏 - 博客园 https://www.cnblogs.com/Mr-Rocker/p/6031096.html js清除浏览器缓存的几种方法 一.CSS和 ...
- 爬虫开发6.selenuim和phantonJs处理网页动态加载数据的爬取
selenuim和phantonJs处理网页动态加载数据的爬取阅读量: 1203 动态数据加载处理 一.图片懒加载 什么是图片懒加载? 案例分析:抓取站长素材http://sc.chinaz.com/ ...
随机推荐
- 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]的一个引 ...
- JQuery button控制div或者section
一.项目你需求 点击左边导航栏的某个按钮,右边内容栏显示出,相应的内容 效果如图 二.html与css.jQuery 1.div模式 <!DOCTYPE html PUBLIC " ...
- Alpha 冲刺 (6/10
Alpha 冲刺 (6/10) 队名:第三视角 组长博客链接 本次作业链接 团队部分 团队燃尽图 工作情况汇报 张扬(组长) 过去两天完成了哪些任务: 文字/口头描述: 1.组织会议 2.帮助队员解决 ...
- 7.5 C++基本序列式容器
参考:http://www.weixueyuan.net/view/6402.html 总结: vector可以理解为可以在两端插入.删除数据的数组,它提供了丰富的成员函数,用于操作数据. begin ...
- SQL-4查找所有已经分配部门的员工的last_name和first_name(自然连接)
题目描述 查找所有已经分配部门的员工的last_name和first_nameCREATE TABLE `dept_emp` (`emp_no` int(11) NOT NULL,`dept_no` ...
- html回顾随笔JS(*^__^*)
---恢复内容开始--- map遍历 function b(){ var week = new Map(); week.set("Mon","星期一"); we ...
- VCL界面控件DevExpress VCL Controls发布v18.2.5|附下载
DevExpress VCL Controls是 Devexpress公司旗下最老牌的用户界面套包.所包含的控件有:数据录入,图表,数据分析,导航,布局,网格,日程管理,样式,打印和工作流等,让您快速 ...
- 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 ...
- JavaScript作用域及作用域链详解、声明提升
相信大家在入门JavaScript这门语言时对作用域.作用域链.变量声明提升这些概念肯定会稀里糊涂,下面就来说说这几个 Javascript 作用域 在 Javascript 中,只有局部作用域和全局 ...
- 网站如何实现 在qq中发自己链接时,便自动获取链接标题、图片和部分内容
如何实现像这种效果?答案如下(要采用分享的形式,复制链接有可能会实现不了效果,至少我的测试是这样的) <head>标签内有QQ专有的标签可以控制要注意QQ的缓存机制,对同一个链接,修改后可 ...