html 表格输出excel,html中导出excel表格

如果在页面上展示了一个数据表格，而用户想把这个表格导出为Excel文件，那么在要求不高的情况下，可以不通过服务器生成表格，而是直接利用JavaScript的Blob和Object URL特性将表格导出。不过，丑话说在前头，这篇随笔中利用了Excel能打开HTML文档的特性，所以导出的表格实际上是一个HTML文档，并且其扩展名只能为.xls，而不能是.xlsx，否则Excel无法打开。(不过确实见过使用JavaScript生成真正Excel文件的方案，这里暂不提及。)

实现代码如下，包含HTML页面和JavaScript脚本：

/* 此样式仅用于浏览器页面效果，Excel不会分离表格边框，不需要此样式 */

table {

border-collapse: collapse;

}

导出表格

// 使用outerHTML属性获取整个table元素的HTML代码(包括

var html = "

// 实例化一个Blob对象，其构造函数的第一个参数是包含文件内容的数组，第二个参数是包含文件类型属性的对象

var blob = new Blob([html], { type: "application/vnd.ms-excel" });

var a = document.getElementsByTagName("a")[0];

// 利用URL.createObjectURL()方法为a元素生成blob URL

a.href = URL.createObjectURL(blob);

// 设置文件名

a.download = "学生成绩表.xls";

使用开发者工具检查a元素，就能大致明白blob URL的工作原理：

导出表格

利用JQ插件导出excel表格：

首先要先下载一个jquery.table2excel.js插件(网上搜搜)，然后使用。

$(function() {

$("#btn").click(function(){

$(".table2excel").table2excel({

exclude: ".noExl",

name: "Excel Document Name",

filename: "myFileName",

exclude_img: true,

exclude_links: true,

exclude_inputs: true

});

});

});