利用javascript实现Excel数据的导出-Excel.Application

最新推荐文章于 2024-07-14 22:15:03 发布

qianling3439

最新推荐文章于 2024-07-14 22:15:03 发布

阅读量3.3k

点赞数

分类专栏： java javascript/JS 文章标签： excel javascript table 工作 button function

java 同时被 2 个专栏收录

94 篇文章 0 订阅

订阅专栏

javascript/JS

17 篇文章 0 订阅

订阅专栏

开发组的同事在项目最关键的时候生病了，一人在领导和客户之间双线作战，苦熬两周，终于搞定了主体工作，终于有时间利用周末把这两周碰到的一些常见的问题和解决方法写下来了。

这里先说说javascript下实现Excel数据导出功能，它利用的是Excel.Application。用过之后，个人觉得该插件虽然方便，但是只能做一些相对简单的数据导出（也可能是由于本人认识有限的原因），而且相关的支持文档太少。该方式还有一个很大的局限，就是如果分页的话，这种导出的Excel数据不全面（只能也就是只能导出当前页面的数据），所以如果开发过程中时间充裕的话，还是建议利用jxl等工具，相对灵活一些。还好项目中对导出的Excel数据质量要求不高，而且数据也不要求分页显示，所以就被迫偷了个懒，凑了了。

废话说多了点，这里转入正题。在网上查了一下Excel.Application将页面数据导入到Excel的方式，总结了一下，有以下两种方式：

第一种：逐个单元格导出法（此方法操作相对复杂，但是比较灵和，适合对导出表有要求的情况）

01. javascript代码如下
02.<SCRIPT LANGUAGE="javascript">
03.function ExcelExport(tableid)
04.{
05.    var table = document.getElementById(tableid); //获取页面的table
06.    var excel = new ActiveXObject("Excel.Application"); //实例化Excel.Application对象
07.    var workB = excel.Workbooks.Add(); 添加新的工作簿
08.    var sheet = workB.ActiveSheet;
09. //var sheet= workB.Worksheets(1);//该句代码和上句代码同意，都是激活一个sheet
10. /***************常用样式设置语句***************************************/
11.    //sheet.Rows(1).WrapText = false; //自动换行设置
12.    //sheet.Rows(1).Font.Size=18;//设置第一行的字体大小
13.    //sheet.Rows(1).Interior.ColorIndex=2;//设置第一行背景色
14.    //sheet.Rows(1).Font.ColorIndex=1;//设置第一行字体色
15.    //sheet.Range(sheet.Cells(1,1),sheet.Cells(1,7)).mergecells=true;//第一行1到7单元格合并
16.    sheet.Columns("A").ColumnWidth =35;//设置列宽
17.    sheet.Columns("B").ColumnWidth =35;
18.    //sheet.Columns("A:B").ColumnWidth =35;//另一种设置列宽的方式
19.    sheet.Rows(1).RowHeight = 35;//设置行高
20.    //sheet.Rows(1).Font.Name="黑体";//设置字体
21.     //sheet.Columns.AutoFit;//所有列自适应宽度
22.     //水平对齐方式(貌似-4108为水平居中)
23.    //sheet.Range( sheet.Cells(1,1),sheet.Cells(1,5)).HorizontalAlignment =-4108;
24.    //垂直对齐方式
25.    //sheet.Range( sheet.Cells(1,1),sheet.Cells(1,5)).VerticalAlignment =-4108;
26.    //根据Borders()中参数值设置各个方向边距，1,2,3,4--->top,buttom,left,right
27.    //sheet.Range( sheet.Cells(2,1),sheet.Cells(1,5)).Borders(1).Weight = 2;
28. /**将页面table写入到Excel中，具体复杂情况（合并单元格等）可在这里面具体操作**********/
29.    var LenRow = table .rows.length; //以下为循环遍历获取页面table的cell元素
30.    for (i = 0; i < LenRow ; i++)
31.    {
32.        var lenCol = table.rows(i).cells.length;
33.        for (j = 0; j < lenCol ; j++)
34.        {
35.            sheet.Cells(i + 1, j + 1).value = table.rows(i).cells(j).innerText; //通过该语句将table的每个
36.                                        //cell赋予Excel 当前Active的sheet下的相应的cell下
37.        }
38.    }
39.    excel.Visible = true;//设置excel为可见
40. excel.UserControl = true; //将Excel交由用户控制
41.}
42.</SCRIPT>
javascript代码如下
<SCRIPT LANGUAGE="javascript">
function ExcelExport(tableid)
{
    var table = document.getElementById(tableid); //获取页面的table
    var excel = new ActiveXObject("Excel.Application"); //实例化Excel.Application对象
    var workB = excel.Workbooks.Add(); 添加新的工作簿
    var sheet = workB.ActiveSheet;
//var sheet= workB.Worksheets(1);//该句代码和上句代码同意，都是激活一个sheet
/***************常用样式设置语句***************************************/
    //sheet.Rows(1).WrapText = false; //自动换行设置
    //sheet.Rows(1).Font.Size=18;//设置第一行的字体大小
    //sheet.Rows(1).Interior.ColorIndex=2;//设置第一行背景色
    //sheet.Rows(1).Font.ColorIndex=1;//设置第一行字体色
    //sheet.Range(sheet.Cells(1,1),sheet.Cells(1,7)).mergecells=true;//第一行1到7单元格合并
    sheet.Columns("A").ColumnWidth =35;//设置列宽
    sheet.Columns("B").ColumnWidth =35;
    //sheet.Columns("A:B").ColumnWidth =35;//另一种设置列宽的方式
    sheet.Rows(1).RowHeight = 35;//设置行高
    //sheet.Rows(1).Font.Name="黑体";//设置字体
     //sheet.Columns.AutoFit;//所有列自适应宽度
     //水平对齐方式(貌似-4108为水平居中)
    //sheet.Range( sheet.Cells(1,1),sheet.Cells(1,5)).HorizontalAlignment =-4108;
    //垂直对齐方式
    //sheet.Range( sheet.Cells(1,1),sheet.Cells(1,5)).VerticalAlignment =-4108;
    //根据Borders()中参数值设置各个方向边距，1,2,3,4--->top,buttom,left,right
    //sheet.Range( sheet.Cells(2,1),sheet.Cells(1,5)).Borders(1).Weight = 2;
/**将页面table写入到Excel中，具体复杂情况（合并单元格等）可在这里面具体操作**********/
    var LenRow = table .rows.length; //以下为循环遍历获取页面table的cell元素
    for (i = 0; i < LenRow ; i++)
    {
        var lenCol = table.rows(i).cells.length;
        for (j = 0; j < lenCol ; j++)
        {
            sheet.Cells(i + 1, j + 1).value = table.rows(i).cells(j).innerText; //通过该语句将table的每个
                                        //cell赋予Excel 当前Active的sheet下的相应的cell下
        }
    }
    excel.Visible = true;//设置excel为可见
excel.UserControl = true; //将Excel交由用户控制
}
</SCRIPT>

第二种方法：整体拷贝法（该方法以较少代码实现Excel数据的导出，但是导出数据格式可能存在样式和页面不一致情况，甚至像背景色等会出现错位，而且如果在html页面中对需要导出的table样式做过设置的话，此处部分样式设置可能不会起作用）

01.<SCRIPT LANGUAGE="javascript">
02.function ExcelExport(tableid)
03.{
04.    var table = document.getElementById(tableid);
05.    var ax =new ActiveXObject("Excel.Application");
06.    var workbook = oXL.Workbooks.Add();
07.     var sheet = workbook.ActiveSheet;
08.     var sel = document.body.createTextRange();
09.
10.     //把table中的数据移到sel中
11.     sel.moveToElementText(table);
12.
13.     sel.select(); //选中sel中所有数据
14.     sel.execCommand("Copy");//复制sel中的数据
15.
16.      sheet.Columns("A").ColumnWidth =35;//设置列宽
17.      sheet.Columns("B").ColumnWidth =35;
18.      sheet.Rows(1).RowHeight = 35;//设置表头高
19.
20.     //将sel中数据拷贝到sheet工作薄中
21.     sheet.Paste();
22.     ax.Visible = true;
23.     //通过打印机直接将Excel数据打印出来
24.     sheet.Printout;
25.     ax.UserControl = true;
26.}
27.</SCRIPT>
<SCRIPT LANGUAGE="javascript">
function ExcelExport(tableid)
{
    var table = document.getElementById(tableid);
    var ax =new ActiveXObject("Excel.Application");
    var workbook = oXL.Workbooks.Add();
     var sheet = workbook.ActiveSheet;
     var sel = document.body.createTextRange();

     //把table中的数据移到sel中
     sel.moveToElementText(table);

     sel.select(); //选中sel中所有数据
     sel.execCommand("Copy");//复制sel中的数据

      sheet.Columns("A").ColumnWidth =35;//设置列宽
      sheet.Columns("B").ColumnWidth =35;
      sheet.Rows(1).RowHeight = 35;//设置表头高

     //将sel中数据拷贝到sheet工作薄中
     sheet.Paste();
     ax.Visible = true;
     //通过打印机直接将Excel数据打印出来
     sheet.Printout;
     ax.UserControl = true;
}
</SCRIPT>
下面为页面的的body部分

01.<div><input type="button" οnclick="javascript:ExcelExport('data');" value="导出到EXCEL"> </div>
02. <table id="data">
03.   <thead>
04.     <tr>
05.       <th>col1</th>
06.       <th>col2</th>
07.       <th>col3</th>
08.     </tr>
09.   </thead>
10.   <tbody>
11.    <tr>
12.     <td>cell11</td>
13.     <td>cell12</td>
14.     <td>cell13</td>
15.    </tr>
16.    <tr>
17.     <td>cell21</td>
18.     <td>cell22</td>
19.     <td>cell23</td>
20.    </tr>
21.   </tbody>
22. </table>
<div><input type="button" οnclick="javascript:ExcelExport('data');" value="导出到EXCEL"> </div>
<table id="data">
   <thead>
     <tr>
       <th>col1</th>
       <th>col2</th>
       <th>col3</th>
     </tr>
   </thead>
   <tbody>
    <tr>
     <td>cell11</td>
     <td>cell12</td>
     <td>cell13</td>
    </tr>
    <tr>
     <td>cell21</td>
     <td>cell22</td>
     <td>cell23</td>
    </tr>
   </tbody>
</table>
      另外，对于Excel.Application使用过程中可能报“Automation 服务器不能创建对象”的错误，对于这个问题，一般原因是IE的安全设置不允许运行未标记为安全的activeX控件，这里只需要在IE“工具->Internate选项->安全->自定义级别”里面将“对未标记为可安全执行脚本的ActiveX控件初始化并执行脚本”置为允许状态即可。