导出HTML的Table到Excel中

======================================================
注：本文源代码点此下载
======================================================

数据报表作为企事业单位上报和下达的重要信息载体,随着信息化建设的不断推进,在实际的工作中得到了前所未有的应用。因此,数据报表已经成为管理信息系统中重要的一项功能,并且,由于数据的多样性和统计信息的增加,数据报表的系统实现变得越来越复杂。

microsoft excel 软件具有十分强大的制表、表格计算等功能,是普通人员常用的制表工具。因此excel在众多企业中的应用十分广泛。当企业进行信息化建设时,必然需要将excel的数据导入到信息化系统中去,或将数据导出到excel中来。如果信息化系统采用c/s结构,导出数据到excel还比较好说,采用b/s结构就不好说了,相关的资料非常的少。

下面本文将介绍一种使用javascript将html的table数据导出到excel的方法。

1. 用javascript操作excel

excel是一个com,因此我们在javascript中像其他的开发语言一样创建excel对象,从而获得访问excel的能力。

var xls = new activexobject( "excel.application" );

上面这句话就创建了一个excel的application对象。

var xlbook = xls.workbooks.add;

上面这句话增加一个excel的workbook。

var xlsheet = xlbook.worksheets(1);

上面这句话获得workbook的sheet1对象。

通过xlsheet.cells(x, y)可以访问sheet中的单元格对象,其中x, y是单元格的坐标位置。

cell对象有很多属性和方法,这里我们将使用到cell的value属性,border属性等。下面给出cell对象三个常用的属性:

cell的value属性是指表格中的字符串值。

cell的interiro.color属性是指单元格的背景色,例如:

xlsheet.cells(curx, cury).interior.color = 0x00ff66;

cell的borders.linestyle属性是指单元格的边框样式,该属性是整型值,0表示没有边框,1表示solid形变框,其他的数字则表示其他的边框类型,大家可以逐个试一下。例如:

xlsheet.cells(curx, cury).borders.linestyle = 1;

同时cell还有其它的属性,例如单元格格式等其他属性,有兴趣的朋友可以查找相关的资料。

2. 用javascript获得table的信息

在javascript中我们可以通过定义table的id,来访问table的相关信息,table具有以下一些对象:

rows对象:行集对象,保存了tr的相关信息,其中用rows[rowindex]即可访问对应的tr的信息,rows.length返回了table中的tr的个数,也就是行的个数。

cells对象:单元格对象,保存了td的相关信息。cells对象存在于rows[rowindex]对象中,访问时得通过具体的rows对象来访问,例如访问第一行的表格对象:rows[0].cells;cells.length返回了cells对象所属行中的td的个数,cells[colindex]则对应具体的td的信息。cells[colindex].outerhtml返回了td的定义语句,cells[colindex].innerhtml返回了td中的内容。例如td的定义如下:

单元格定义

则cells[colindex].outerhtml返回的结果是“

单元格定义”,cells[colindex].innerhtml返回的结果是“单元格定义”

3. 用javascript遍历html中的table

了解了table的属性以后,我们就可以用javascript来遍历table的每一个单元格了,下面是遍历的程序,具体的例子代码请查看附录1

function accessalltable(objtab)

{

for (var i = 0; i{

for (var j = 0; j{

s = objtab.rows[i].cells[j].outerhtml;

alert("第" + i + "行,第" + j + "列:outerhtml为" + s);

s = objtab.rows[i].cells[j].outerhtml;

alert("第" + i + "行,第" + j + "列:innerhtml为" + s);

}

}

}

4. 合并单元格

在html的table中,合并单元格是很简单的事情,只需要指定td的colspan或者rowspan即可跨行或者跨列,而在excel中,合并单元格需要先指定range(范围),例如,合并从cells(0, 0)到cells(2, 2)的单元格,则在javascript中这样写就可以了:

xls.range(xls.cells(0, 0), xls.cells(2, 2)).mergecells = true;

range同时还是一个对象,我们可以声明一个变量来取出range对象,并设置对象的相关属性,例如:

var r = xls.range(xls.cells(0, 0), xls.cells(2, 2));

r.mergecells = true;

5. 导出html的table到excel中去

有了上面的知识,我们就可以开始用javascript导出html的table到excel中去了。下面是导出的代码,具体的例子代码请查看附录1

function printtabletoexcel(objtab)

{

try

{

var xls = new activexobject( "excel.application" );

}

catch(e)

{

alert( "要打印该表,您必须安装excel电子表格软件,同时浏览器须使用“activex 控件”,您的浏览器须允许执行控件。 请点击【帮助】了解浏览器设置方法!");

return false;

}

xls.visible = true;

var xlbook = xls.workbooks.add;

var xlsheet = xlbook.worksheets(1);

var x = 1;

var y = 1;

for (var i = 0; i{

y = 1;

for (var j = 0; j{

xlsheet.cells(x, y).value = objtab.rows[i].cells[j].innerhtml;

xlsheet.cells(x, y).borders.linestyle = 1;

y++;

}

x++;

}

xlsheet.columns.autofit; //自动适应大小

return;

}

6. 增强型的导出功能

因为excel可以合并单元格,所以我们可以根据td的定义中是否有colspan或rowspan属性来判断是否需要合并单元格。但是colspan和rowspan这两个属性似乎在javascript中没有直接访问的方法,因此我们只能采用笨方法来获得colspan或rowspan的属性值。首先我们取出td的定义字符串,然后在这个字符串中查找是否有"colspan="或"rowspan="的子串,如果有的话,则取出子串后面跟着的数字,该数字表明td跨列或跨行的个数,具体的实现程序如下所示:

// str – td的定义字符串

// prop – 属性值,可以是colspan、rowspan、border、width等数值型属性的名称

// 返回值是属性的值

// 例如td的定义为

xx

// 则 getpropvalue_r("td width=100>xx", "width")返回100

function getintpropvalue_r(str, prop)

{

var s = str.touppercase(str);

var p = prop.touppercase(prop);

var idx = s.indexof(p);

var propvalue = "";

if (idx >= 0)

{

var x = prop.length;

while ((str.charat(idx + x)"9"))

{

x++;

}

while ((str.charat(idx + x) >= "0") && (str.charat(idx + x){

propvalue = propvalue + str.charat(idx + x);

x++;

}

return propvalue;

}

else

return "0";

}

同样,我们还可以把上面的函数改造一下,让它可以返回td的align等字符串型的属性,这里就不再给出实现函数了。

有了上面的函数,我们就可以在导出table到excel时动态判断td的colspan和rowspan属性,然后在excel中合并相应的单元格,从而增强导出功能,使excel的格式同table的格式完全匹配。附录1给出了一个导出简单table到excel的例子,这里的table有跨行和跨列的td存在,导出结果同html的table完全一样,这是比较简单的table,td在跨行时只能在第一列,否则将不能正确导出。大家可以改造一下导出的算法,让它可以适应复杂的表格导出,不过比较困难。

7. ie的安全问题

由于ie在创建activex控件时可能会产生安全问题,因此ie的安全设置中该项的默认值是禁止创建activex控件的,为了在使用时能够正确的完成功能,只需在ie的安全设置中创建activex控件的选项设置为启用或提示即可

======================================================
在最后，我邀请大家参加新浪APP，就是新浪免费送大家的一个空间，支持PHP+MySql，免费二级域名，免费域名绑定 这个是我邀请的地址，您通过这个链接注册即为我的好友，并获赠云豆500个，价值5元哦！短网址是http://t.cn/SXOiLh我创建的小站每天访客已经达到2000+了，每天挂广告赚50+元哦，呵呵，饭钱不愁了，\(^o^)/