将页面表格导出为excel并下载

喜欢ヅ旅行 2022-03-18 14:48 490阅读 0赞

将页面表格导出为excel并下载的方式有很多，

本次介绍的是表格div的下载。

这种方式很简单，不需要去创建excel文件，也不需要创建工作簿，然后一点一点的填写数据。只需要将页面的div中的表格下载。

js代码如下

function printExcle() {
    	// 使用outerHTML属性获取整个table元素的HTML代码（包括<table>标签），然后包装成一个完整的HTML文档，设置charset为urf-8以防止中文乱码
        var html = "<html><head><meta charset='utf-8' /></head><body>" + $("#allInformation").html() + "</body></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";
    }

在页面的jsp中，加入一个超链接标签

页面效果如下

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2lpaWlpaWxpa2FuZ3NodWFp_size_16_color_FFFFFF_t_70][]

右边的打印便是打印的页面中表格的数据。

由于没有数据库数据，当下载后，文件的内容是这样的

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2lpaWlpaWxpa2FuZ3NodWFp_size_16_color_FFFFFF_t_70 1][]

这样的简单方法，可以实现excel的简单下载。

如需要更多的帮助，评论，我会第一时间帮助您。

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2lpaWlpaWxpa2FuZ3NodWFp_size_16_color_FFFFFF_t_70]: /images/20220318/037c5f961fe845c6b8c740b4f9a5ff9e.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2lpaWlpaWxpa2FuZ3NodWFp_size_16_color_FFFFFF_t_70 1]: /images/20220318/6deb1d56365d40ab9ab0daae7507792b.png