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/ ...
随机推荐
- 真实分享记录我学习Linux系统遇到的问题
对于linux,又爱又恨,也有自己的一些看法,毕竟已经接触了快两年了.但是,说出来都是伤,为什么呢?如果您想知道请让我给您慢慢道来. 最开始接触linux是在高考完后,由于我家的台式电脑太卡,于是我就 ...
- unity中导入插件时报错处理办法
错误如下: Unhandled Exception: System.TypeLoadException: Could not load type 'System.ComponentModel.Init ...
- Java使用wait() notify()方法操作共享资源
Java多个线程共享资源: 1)wait().notify()和notifyAll()方法是本地方法,并且为final方法,无法被重写. 2)调用某个对象的wait()方法能让当前线程阻塞,并且当前线 ...
- linux150条命令
●线上查询及帮助命令(2 个)man help ●文件和目录操作命令(13 个) ls tree pwd mkdir rmdir cd touch cp mv rm ln find rename ●查 ...
- 重写equals() 和 hashCode()方法
什么情况下需要重写呢? 比如去重操作时, 有时候往Set集合存放对象User,我们User类的字段太多时,比如有50个字段, 判断两个User对象相同,不需要判断它们所有字段都相同,只需要判断它们的某 ...
- Eclipse界面简介
下载安装完成后,Eclipse的界面如下: (6)为eclipse的perspective(视图方案)由于安装的是for Java development的eclipse,故视图界面默认 为使用Jav ...
- idea查看jar包是否存在
idea在project目录下如下图(1),是总的pom文件,定义了四个子模块共用的依赖,并且其中定义了四个子模块,,每个模块都有各自的pom.xml文件.结构目录只有一个总的lib库. 但是可能在s ...
- ubuntu 删除开机系统引导，设置快速开机和安静开机
1.隐藏开机选择界面 1.sudo gedit /etc/default/grub GRUB_HIDDEN_TIMEOUT=0 GRUB_HIDDEN_TIMEOUT_QUIET=true //隐藏开 ...
- DevExpress v18.1新版亮点——DevExtreme篇（三）
用户界面套包DevExpress v18.1日前终于正式发布,本站将以连载的形式为大家介绍各版本新增内容.本文将介绍了DevExtreme JavaScript Controls v18.1 的新功能 ...
- java websocket学习
引言: websocket,webservice傻傻分不清楚,都觉得是很高深的东西,理解中的webservice是一种协议,通信协议,类似http协议的那种,比如使用webservice协议调后台接口 ...