js+php简单实现下载页面中当前显示的表格内容

对于这个问题，今天终于找到了一个比较简单的方法，hin开森，分享记录下！

一、首先不管用何种方法，将表格内容显示到页面上！

二、设置一个按钮，增加点击事件方法，如：

/*下载表格*/
function dl_excel(){
var table = document.getElementById('table_data');//table_data是在table表格上加的id，获取到该表格
var table_html = table.outerHTML;//获取到整个表格的html
document.location.href = 'dlExcel.php?table_html='+table_html;//传入php文件中
}

三、创建一下dlExcel.php文件：

<?php  
$date = date('YmdHis');
$excelName = "访问记录表_".$date; //表名自定义
header("Content-type:application/vnd.ms-excel");
header("Content-Disposition:filename=$excelName.xls");
echo $_REQUEST['table_html'];
?>

四、到第三步就已经完事了！点击页面上设置的那个按钮，就可以下载表格了！页面中的表格是什么内容，下载下来的就是什么内容！是不是很方便~哈哈

PS：之前不懂innerHTML和outerHTML有什么区别，特地百度了一下：

一、区别：1）innerHTML:　　从对象的起始位置到终止位置的全部内容,不包括Html标签。2）outerHTML:　　除了包含innerHTML的全部内容外, 还包含对象标签本身。二、例子：<div id="test">    <span style="color:red">test1</span> test2 </div>1）这个div对象的innerHTML的值是“<span style="color:red">test1</span> test2 ”2）这个div对象的outerHTML的值是<div id="test"><span style="color:red">test1</span> test2</div>

~~~

2017-11-30 添加：

如果上述方法，使用时存在问题，可以变换一下方法；在传递dom内容的时候，可能传输不完整，下面说下使用form表单进行传递到php。

1. form表单

<form action="dlExcel.php" method="post"  id="excelfromtable" style="" target="_blank">    <input name="excelContent" id="excelContent" type="hidden" value="" autocomplete="off"/></form>

2. js

function dl_excel(){    var table = document.getElementById('table_data');    var table_html = table.outerHTML;    $('input[name=excelContent]').val(table_html);//赋值给表单    $('#excelfromtable').submit();//表单提交，提交到php}

3. php

<?php  echo '<meta http-equiv="Content-type" content="text/html; charset=utf-8 " />'; //设置内容，编码$date = date('YmdHis');$excelName = "付款记录表_".$date;header("Content-type:application/vnd.ms-excel");header("Content-Disposition:filename=$excelName.xls");$content = $_POST['excelContent'];echo $content;?>

~~~