首页 > 代码库 > 如何将页面上的数据导入excel中

如何将页面上的数据导入excel中

2024-10-06 03:27:39   220人阅读

网上关于页面数据导入excel的文章很多，但是大部分都是关于 ActiveXObject 对象，可是ActiveXObject 对象是只支持IE的，可我连IE11也测试了，还是无法识别，又查到消息，好像该对象只支持IE7，IE8，所以果断放弃。

继续查找各大论坛，终于找到JsExcelXml的插件，

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="http://www.mamicode.com/js/jquery-1.8.3.min.js"></script>
<script src="http://www.mamicode.com/js/JsExcelXml.js"></script>
<script>
//导出数据到excel文件

function exportExcel()
{
var columnsInfo = [];//列设置

var data = http://www.mamicode.com/[];//数据


$("#grid").find("th").each(function(i) {
var text = $(this).text();
var column = { field: text, title: text};
columnsInfo.push(column);
});
$("#grid").find("tr").each(function(i) {
if(i == 0) return true;
var dataObj = new Object();
$(this).find("td").each(function(j) {
var column = columnsInfo[j];
var text = $(this).text();
dataObj[column.field] = text;
});
data.push(dataObj);
});


//导出excel设置

var opts = {
HeadInfo: [columnsInfo],
RowInfo: data,
FooterInfo: null,
MergeCells: null,
CellStyles: null,
MainTitle: { Displayname: ‘‘, Alignment: ‘Center‘, BgColor: ‘#FFFFFF‘, FontSize: 16, FontColor: "#000000", IsBold: true, IsItalic: false, IsUnderLine: false },
SecondTitle: { Displayname: ‘‘, Alignment: ‘Left‘, BgColor: ‘#FFFFFF‘, FontSize: 14, FontColor: "#000000", IsBold: true, IsItalic: false, IsUnderLine: false },
HeadStyle: { Alignment: ‘Center‘, BgColor: ‘#D8D8D8‘, FontSize: 12, FontColor: "#000000", IsBold: true, IsItalic: false, IsUnderLine: false },
DataStyle: { Alignment: ‘Center‘, BgColor: ‘#FFFFFF‘, FontSize: 10, FontColor: "#000000", IsBold: false, IsItalic: true, IsUnderLine: false },
FootStyle: { Alignment: ‘Center‘, BgColor: ‘#D8D8D8‘, FontSize: 12, FontColor: "#000000", IsBold: true, IsItalic: false, IsUnderLine: false },
RowStart: 1,
ColumStart: 1,
SheetName: ‘sheet‘
}
var excelxml = JSXmlExcel.BulidXml(opts);//导出的excel对应的xml字符串


if ($.browser.msie) { //如果是IE浏览器，ie方式的导出

var xlsWin = null;
if (!!document.all("glbHideFrm")) {
xlsWin = glbHideFrm;
} else {
var width = 1; var height = 1;
var openPara = "left=" + (window.screen.width / 2 + width / 2) + ",top=" + (window.screen.height + height / 2) + ",scrollbars=no,width=" + width + ",height=" + height;
xlsWin = window.open("", "_blank", openPara);
}
xlsWin.document.write(excelxml);
xlsWin.document.close();
xlsWin.document.execCommand(‘Saveas‘, true, "导出数据.xls");
xlsWin.close();
}else{ //其他浏览器的导出

var urlObject = window.URL || window.webkitURL || window;
var export_blob = new Blob([excelxml]);
var save_link = document.createElementNS("http://www.w3.org/1999/xhtml", "a")
save_link.href = http://www.mamicode.com/urlObject.createObjectURL(export_blob);
save_link.download = "导出数据.xls";
var ev = document.createEvent("MouseEvents");
ev.initMouseEvent(
"click", true, false, window, 0, 0, 0, 0, 0
, false, false, false, false, 0, null
);
save_link.dispatchEvent(ev);
}

}

</script>
</head>

<body>
<button onclick="exportExcel();return false;">导出数据为excel文件</button><br><br>

<style type="text/css">
table.gridtable {
font-family: verdana,arial,sans-serif;
font-size:11px;
color:#333333;
border-width: 1px;
border-color: #666666;
border-collapse: collapse;
}
table.gridtable th {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #666666;
background-color: #dedede;
}
table.gridtable td {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #666666;
background-color: #ffffff;
}
</style>


<table id="grid" class="gridtable">
<tr>
<th>Header1</th><th>Header2</th><th>Header3</th>
</tr>
<tr>
<td>Text 1A</td><td>Text 1B</td><td>Text 1C</td>
</tr>
<tr>
<td>Text 2A</td><td>Text 2B</td><td>Text 2C</td>
</tr>
</table>



</body>

</html>

这是主要针对table结构的数据进行处理。

如何将页面上的数据导入excel中


联系
我们