您的位置:

tabletocsvjs代码的简单介绍

tabletocsvjs代码的简单介绍

更新:

本文目录一览:

js 导出大数据到excel

完整代码:

//导出excelfunction tableToExcel(){

var arrSor = ["sorttable10","sorttable30","sorttable60","sorttable120"]

let str = "";

for (var k = 0; k arrSor.length; k++) {

var tab=document.getElementById(arrSor[k]);

var rows=tab.rows;

const jsonData = [];

for(var i=2;irows.length;i++){ //遍历表格的行

var json = {};

for(var j=0;jrows[i].cells.length;j++){ //遍历每行的列

json[(i+1)+"-"+(j+1)] = rows[i].cells[j].innerHTML;

}

jsonData.push(json);

}

//列标题

let str1 = "trtd align='center' colspan='5'b最大"+arrSor[k].substring(9,arrSor[k].length)+"分钟雨量/b/td/tr";

let str2 = "tr align='center'th站点/thth站名/thth雨量最大值/thth降水时段/thth落入最大降水时段/th/tr";

//循环遍历,每行加入tr标签,每个单元格加td标签

for(let i = 0 ; i jsonData.length ; i++ ){

str2+='tr';

for(let item in jsonData[i]){

//增加\t为了不让表格显示科学计数法或者其他格式

var itemTem= jsonData[i][item];

if (itemTem == "暂无数据") {

str2+=`td colspan='5' align='center'${ itemTem + '\t'}/td`;

}else {

str2+=`td align='center'${ itemTem + '\t'}/td`;

}

}

str2+='/tr';

}

let str3 = "trtd colspan='5'/td/tr";

str += (str1 + str2 + str3);

}

let worksheet = '雨量最大值'

let uri = 'data:application/vnd.ms-excel;base64,';

//下载的表格模板数据

let template = `html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns=""headmeta charset='UTF-8'!--[if gte mso 9]xml

x:ExcelWorkbookx:ExcelWorksheetsx:ExcelWorksheet

x:Name${worksheet}/x:Namex:WorksheetOptionsx:DisplayGridlines//x:WorksheetOptions/x:ExcelWorksheet/x:ExcelWorksheets/x:ExcelWorkbook/xml![endif]--

style type="text/css"

table {border: 1px solid #000000;}

table tr td b {background:#FFFFFF;color:#3D3D3D;font-size:24px;border: 1px solid #000000;}

table th {background:#AEE1FE;color:#3D3D3D;font-size:20px;border: 1px solid #000000;}

table td {background:#FFFFFF;color:#3D3D3D;font-size:20px;border: 1px solid #000000;}/style

/headbodytable${str}/table/body/html`;

//下载模板

// window.location.href = uri + this.base64(template)

var link = document.createElement("a");

link.href = uri + this.base64(template);

link.download = "雨量最大值-" +new Date().format("yyyy年MM月dd日 h时")+ ".xls";

link.style = "visibility:hidden";

document.body.appendChild(link);

link.click();

document.body.removeChild(link);}//输出base64编码function base64 (template) {

return window.btoa(unescape(encodeURIComponent(template))) }

解析:

遍历取出表,顺序是行从上往下,列从左往右,将数据存进数组,下面再拼接成表。

image.png

参考文章:

第一种方法(大量数据导出)

//导出excelfunction tableToExcel() {

var arrSor = ["sorttable10","sorttable30","sorttable60","sorttable120"]

let str = "";

for (var k = 0; k arrSor.length; k++) {

var tab=document.getElementById(arrSor[k]);

var rows=tab.rows;

const jsonData = [];

for(var i=2;irows.length;i++){ //遍历表格的行

var json = {};

for(var j=0;jrows[i].cells.length;j++){ //遍历每行的列

if (rows[i].cells[j].outerHTML.indexOf("rgb(255, 255, 0)") != -1) {

json["yellow"+(i+1)+"-"+(j+1)] = rows[i].cells[j].innerHTML;

}else {

json[(i+1)+"-"+(j+1)] = rows[i].cells[j].innerHTML;

}

}

jsonData.push(json);

}

//列标题

let str1 = "trtd colspan='5' align='center' style='background-color:#FFFFFF;font-size:24px;border: 1px solid #000000;'b最大"

+arrSor[k].substring(9,arrSor[k].length)+"分钟雨量/b/td/tr";

let str2 = "tr" +

"th style='background-color:#AEE1FE;font-size:22px;border: 1px solid #000000;' align='center'站点/th" +

"th style='background-color:#AEE1FE;font-size:22px;border: 1px solid #000000;' align='center'站名/th" +

"th style='background-color:#AEE1FE;font-size:22px;border: 1px solid #000000;' align='center'雨量最大值/th" +

"th style='background-color:#AEE1FE;font-size:22px;border: 1px solid #000000;' align='center'降水时段/th" +

"th style='background-color:#AEE1FE;font-size:22px;border: 1px solid #000000;' align='center'落入最大降水时段/th/tr";

//循环遍历,每行加入tr标签,每个单元格加td标签

for(let i = 0 ; i jsonData.length ; i++ ){

str2+="tr align='center'";

for(let item in jsonData[i]){

if (item.indexOf("yellow") != -1) {//取列数等于3

//增加\t为了不让表格显示科学计数法或者其他格式

var itemTem= jsonData[i][item];

if (itemTem == "暂无数据") {

str2+=`td colspan='5' style='background-color:#FFFF00;font-size:22px;border: 1px solid #000000;' ${ itemTem + '\t'}/td`;

}else {

str2+=`td style='background-color:#FFFF00;font-size:22px;border: 1px solid #000000;' ${ itemTem + '\t'}/td`;

}

}else {

//增加\t为了不让表格显示科学计数法或者其他格式

var itemTem= jsonData[i][item];

if (itemTem == "暂无数据") {

str2+=`td colspan='5' style='background-color:#FFFFFF;font-size:22px;border: 1px solid #000000;' ${ itemTem + '\t'}/td`;

}else {

str2+=`td style='background-color:#FFFFFF;font-size:22px;border: 1px solid #000000;' ${ itemTem + '\t'}/td`;

}

}

}

str2+='/tr';

}

let str3 = "trtd colspan='5' style='background-color:#FFFFFF;border: 1px solid #000000;'/td/tr";

str += (str1 + str2 + str3);

}

var tableHtml="htmlheadmeta charset='UTF-8'/headbodytable"+str+"/body/html"

var excelBlob = new Blob([tableHtml], {type: 'application/vnd.ms-excel'});

var fileName = "雨量最大值-"+new Date().format("yyyy年MM月dd日 h时")+".xls";

if(isIE()){

window.navigator.msSaveOrOpenBlob(excelBlob,fileName);

}else{

var oa = document.createElement('a');

oa.href = URL.createObjectURL(excelBlob);

oa.download = fileName;

document.body.appendChild(oa);

oa.click();

}} //判断是否IE浏览器function isIE() {

if (!!window.ActiveXObject || "ActiveXObject" in window) {

return true;

} else {

return false;

}}

参考文章:

如何用jquery把文件导出成csv格式文件

兼容性好点就发送内容到服务器,又服务器处理,设置"Content-Disposition"响应头"attachment;filename=\"xxx.csv\"")

要不就只能IE浏览器下的document.execCommand('SaveAs', 'xxx.csv');了,兼容性不是很好,而且好像指定的文件名和后缀没效果。。

div id="dv"

table

tr

th

tabletrth/thth/thth/th/tr/table

/th

th

tabletrth/thth/thth/th/tr/table

/th

th

tabletrth/thth/thth/th/tr/table

/th

/tr

/table

/div

iframe id="ifr" style="position:absolute;left:-999px;top:-999px;" src="javascript:void(0)"/iframe

script type="text/javascript"

    window.onload = function () {

        if (!!document.all) { alert('非IE浏览器无法直接JS控制保存文件!'); return false; }

        var doc = document.getElementById('ifr').contentWindow.document;

        doc.open();

        doc.write(document.getElementById('dv').innerHTML);

        doc.close();

        doc.execCommand('SaveAs', 'xxx.csv');

    }

/script

Java后台代码读取html页面table中的内容并保存到当地为.csv文件

table内容是从数据库取的吧,你也可以从数据库读取啊。再写入cvs就行了,没必要去解析这个table

Python 和 BeautifulSoup 怎么把 html table 处理成 csv

Python 和 BeautifulSoup 把 html table 处理成 csv,代码如下:

#coding:utf8

import urllib

import urllib2

import cookielib

import re

import csv

import codecs

from bs4 import BeautifulSoup

wiki = ''

header = {'User-Agent': 'Mozilla/5.0'}

req = urllib2.Request(wiki,headers=header)

page = urllib2.urlopen(req)

soup = BeautifulSoup(page)

name = "" #名字

creater = "" #归属

first = "" #首次公开发布的时间

latest = "" #最新稳定版本

cost = "" #售价

licence = "" #授权条款

table = soup.find("table", {"class" : "sortable wikitable"})

f = open('table.csv', 'w')

csv_writer = csv.writer(f)

td_th = re.compile('t[dh]')

for row in table.findAll("tr"):

cells = row.findAll(td_th)

if len(cells) == 6:

name = cells[0].find(text=True)

if not name:

continue

creater = cells[1].find(text=True)

first = cells[2].find(text=True)

latest = cells[3].find(text=True)

cost = cells[4].find(text=True)

licence = cells[5].find(text=True)

csv_writer.writerow([ x.encode('utf-8') for x in [name, creater, first, latest, cost, licence]])

f.close()

Javascript实现把网页中table的内容导出到excel中的几种方法

一、 直接拷贝整个表格到EXCEL中二、 通过遍历表格,给EXCEL中相应的单元格赋值。三、 把表格中的内容提取出来,利用IE的另存为.csv的格式。各方法的好处:1. 直接拷贝表格,能够保留表格中的原有的格式,比如,列,行的合并,对齐方式,底色等等,2. 通过遍历表格,比较灵活,可以遍历表格某些需要部分的内容。3. 利用IE的另存为,不用创建ActiveXObject对象,可以处理表格合并方面的问题。各方法的缺点:1. 可能弹出脚本错误:Automation不能创建对象。解决方法:启用IE安全设置中的:对没有标记为安全的ActiveX控件进行初始化和脚本运行。由于整个表格复制到EXCEL中,给表格加个标题,并加入到EXCEL中可能会遇到麻烦。解决方法:首先在表格中加入第一行trtd colspan="x" align="center"/td/trX,表示整个表格的列数,复制完整个表格后,加如下代码,oSheet为当前活动的sheet.oSheet.Range(oSheet.Cells(1, 1), oSheet.Cells(1, x)).value = "表格标题";//设置标题oSheet.Rows(1).Font.Size = 16; //设置文字大小oSheet.Rows(1).Font.Name = "宋体";//设置文字字体注:以下属性我没用着,可能有用,也可能会报错oSheet.Range(oSheet.Cells(1,1), oSheet.Cells(1,14)).mergecells=true; //合并单元格oSheet.Range(oSheet.Cells(1,1), oSheet.Cells(1,14)).Interior.ColorIndex=6;//设置底色?oSheet.Range(oSheet.Cells(1,1), oSheet.Cells(1,14)).Font.ColorIndex=5;//设置字体色?oSheet.Rows(1).RowHeight=20; //设置列高oSheet.Cells(iRow,iCol).Halignment=’2’//设置字体居中2. 可能弹出脚本错误:Automation不能创建对象(解决方法如上)。表格内容写入到EXCEL中无表格线(未解决)且有单元格合并时会有问题,解决方法:合并单元格后再写数据。oSheet.Range(oSheet.Cells(1,1), oSheet.Cells(1,14)).mergecells=true; //合并单元格3. 表格内容写入到EXCEL中无表格线(未解决)表格格式复杂时,会有问题,(rowspan1 or colspan1),解决方法:一般都是表头格式比较复杂,可先把表头写死,然后再循环写其他数据。代码如下:!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"HTMLHEADTITLE New Document /TITLE

META NAME="Generator" CONTENT="EditPlus"

META NAME="Author" CONTENT=""

META NAME="Keywords" CONTENT=""

META NAME="Description" CONTENT=""

/HEAD BODY

table id="tableExcel" width="100%" border="1" cellspacing="0" cellpadding="0"trtd colspan="5" align="center"WEB页面导出为EXCEL文档的方法/td/trtrtd列标题1/tdtd列标题2/tdtd列标题3/tdtd列标题4/tdtd列标题5/td/trtrtdaaa/tdtdbbb/tdtdccc/tdtdddd/tdtdeee/td/trtrtdAAA/tdtdBBB/tdtdCCC/tdtdDDD/tdtdEEE/td/trtrtdFFF/tdtdGGG/tdtdHHH/tdtdIII/tdtdJJJ/td/tr/table

input type="button" onclick="javascript:method1('tableExcel');" value="第一种方法导入到EXCEL"input type="button" onclick="javascript:method2('tableExcel');" value="第二种方法导入到EXCEL"input type="button" onclick="javascript:getXlsFromTbl('tableExcel',null);" value="第三种方法导入到EXCEL"

SCRIPT LANGUAGE="javascript"function method1(tableid)

{//整个表格拷贝到EXCEL中var curTbl = document.getElementById(tableid);var oXL = new ActiveXObject("Excel.Application");//创建AX对象excelvar oWB = oXL.Workbooks.Add();//获取workbook对象var oSheet = oWB.ActiveSheet;//激活当前sheetvar sel = document.body.createTextRange();sel.moveToElementText(curTbl);//把表格中的内容移到TextRange中sel.select();//全选TextRange中内容sel.execCommand("Copy");//复制TextRange中内容oSheet.Paste();//粘贴到活动的EXCEL中oXL.Visible = true;//设置excel可见属性}function method2(tableid) //读取表格中每个单元到EXCEL中

{var curTbl = document.getElementById(tableid);var oXL = new ActiveXObject("Excel.Application");//创建AX对象excelvar oWB = oXL.Workbooks.Add();//获取workbook对象var oSheet = oWB.ActiveSheet;//激活当前sheetvar Lenr = curTbl.rows.length;//取得表格行数for (i = 0; i Lenr; i++){var Lenc = curTbl.rows(i).cells.length;//取得每行的列数for (j = 0; j Lenc; j++){oSheet.Cells(i + 1, j + 1).value = curTbl.rows(i).cells(j).innerText;//赋值}}oXL.Visible = true;//设置excel可见属性}function getXlsFromTbl(inTblId, inWindow) {try {var allStr = "";var curStr = "";//alert("getXlsFromTbl");if (inTblId != null inTblId != "" inTblId != "null") {curStr = getTblData(inTblId, inWindow);}if (curStr != null) {allStr += curStr;}else {alert("你要导出的表不存在!");return;}var fileName = getExcelFileName();doFileExport(fileName, allStr);}catch(e) {alert("导出发生异常:" + e.name + "-" + e.description + "!");}}

//---------------------------------------------

function getTblData(inTbl, inWindow) {var rows = 0;//alert("getTblData is " + inWindow);var tblDocument = document;if (!!inWindow inWindow != "") {if (!document.all(inWindow)) {return null;}else {tblDocument = eval(inWindow).document;}}var curTbl = tblDocument.getElementById(inTbl);var outStr = "";if (curTbl != null) {for (var j = 0; j curTbl.rows.length; j++) {//alert("j is " + j);for (var i = 0; i curTbl.rows[j].cells.length; i++) {//alert("i is " + i);if (i == 0 rows 0) {outStr += " ";rows -= 1;}outStr += curTbl.rows[j].cells[i].innerText + " ";if (curTbl.rows[j].cells[i].colSpan 1) {for (var k = 0; k curTbl.rows[j].cells[i].colSpan - 1; k++) {outStr += " ";}}if (i == 0) {if (rows == 0 curTbl.rows[j].cells[i].rowSpan 1) {rows = curTbl.rows[j].cells[i].rowSpan - 1;}}}outStr += " ";}}else {outStr = null;alert(inTbl + "不存在!");}return outStr;}function getExcelFileName() {var d = new Date();var curYear = d.getYear();var curMonth = "" + (d.getMonth() + 1);var curDate = "" + d.getDate();var curHour = "" + d.getHours();var curMinute = "" + d.getMinutes();var curSecond = "" + d.getSeconds();if (curMonth.length == 1) {curMonth = "0" + curMonth;}if (curDate.length == 1) {curDate = "0" + curDate;}if (curHour.length == 1) {curHour = "0" + curHour;}if (curMinute.length == 1) {curMinute = "0" + curMinute;}if (curSecond.length == 1) {curSecond = "0" + curSecond;}var fileName = "leo_zhang" + "_" + curYear + curMonth + curDate + "_"+ curHour + curMinute + curSecond + ".csv";//alert(fileName);return fileName;}function doFileExport(inName, inStr) {var xlsWin = null;if (!!document.all("glbHideFrm")) {xlsWin = glbHideFrm;}else {var width = 6;var height = 4;var openPara = "left=" + (window.screen.width / 2 - width / 2)+ ",top=" + (window.screen.height / 2 - height / 2)+ ",scrollbars=no,width=" + width + ",height=" + height;xlsWin = window.open("", "_blank", openPara);}xlsWin.document.write(inStr);xlsWin.document.close();xlsWin.document.execCommand('Saveas', true, inName);xlsWin.close();}

jsPDF 将html代码中的table导出为pdf文件怎么弄

jsPDF 将html代码中的table导出为pdf文件怎么弄

Java代码 收藏代码

html

head

titleExport html table to excel and csv using jquery/title

script src="/jquery-1.9.1.min.js"/script

link rel="stylesheet" href=""

script type="text/javascript" src="/jquery.base64.js"/script

script type="text/javascript" src=/tableExport.js"/script

script type="text/javascript" src="/jspdf/libs/sprintf.js"

/script

script type="text/javascript" src=""/script

script type="text/javascript" src="/jspdf/base64.js"/script

/head

body

[align=right]

brbrbr

button class="btn btn-success" onClick ="$('#customers').tableExport({type: 'excel', escape: 'false'});"Excel Export/button

button class="btn btn-success" onClick ="$('#customers').tableExport({type: 'pdf', escape: 'false'});"CSV Export/button

brbr

[/align]

table id="customers" class="table table-striped table-bordered"

thead

tr class='warning'

thCountry/th

thPopulation/th

thDate/th

/tr

/thead

tbody

tr

tdChinna/td

td1,363,480,000/td

tdMarch 24, 2014/td

/tr

tr

tdIndia/td

td1,241,900,000/td

tdMarch 24, 2014/td

/tr

tr

tdUnited States/td

td317,746,000/td

tdMarch 24, 2014/td

/tr

tr

tdIndonesia/td

td249,866,000/td

tdJuly 1, 2013/td

/tr

tr

tdBrazil/td

td201,032,714/td

tdJuly 1, 2013/td

/tr

/tbody

/table

/div

/body

/html

tabletocsvjs代码的简单介绍

本文目录一览: 1、js 导出大数据到excel 2、如何用jquery把文件导出成csv格式文件 3、Java后台代码读取html页面table中的内容并保存到当地为.csv文件 4、Python

2023-12-08
javascript入门笔记1的简单介绍

2022-11-18
htmljs编程笔记(html代码笔记)

本文目录一览: 1、html代码和JS代码有什么区别 2、如何在html中调用js函数 3、JavaScript学习笔记之数组基本操作示例 4、HTML5初学者笔记 5、《web前端笔记7》js字符—

2023-12-08
python使用笔记23的简单介绍

2022-11-10
javascript简要笔记,JavaScript读书笔记

2022-11-17
java包笔记,Java语言包

2022-11-18
angularjs代码笔记01,angularjs简介

本文目录一览: 1、请问谁有混淆Angularjs代码的经验 2、如何使用angularjs处理动态菜单 3、如何看angularjs源代码 4、下回来的angularJs+bootstrap模板怎么

2023-12-08
java客户端学习笔记(java开发笔记)

2022-11-14
印象笔记记录java学习(Java成长笔记)

2022-11-12
c到c语言笔记的简单介绍

2022-11-24
重学java笔记,java笔记总结

2022-11-23
java基础知识学习笔记一,Java基础笔记

2022-11-21
java基础第一天学习笔记(java课程笔记)

2022-11-09
java学习笔记(java初学笔记)

2022-11-14
重拾python笔记三的简单介绍

2022-11-13
java笔记,大学java笔记

2022-11-28
Markdown笔记的全方位介绍

2023-05-18
java笔记,尚硅谷java笔记

2022-12-01
发篇java复习笔记(java课程笔记)

2022-11-09
java方向综合笔试题的简单介绍

2022-11-23