博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
javascript 将HTML导出word(非IE)
阅读量:6947 次
发布时间:2019-06-27

本文共 1398 字,大约阅读时间需要 4 分钟。

hot3.png

<!doctype html>

<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <script>
  //不支持IE6,7,8
function MakeWord() {
            try {
                if (!window.Blob) {
                    alert('不支持您的浏览器!');
                    return;
                }
                var html, link, blob, url,css;//定义变量
                css = (
                 '<style>' +
                 'table{border-collapse:collapse;}td{border:1px gray solid;width:5em;padding:2px;}'+
                 '</style>'
               );//定义导出样式
                html = window.div_test.innerHTML; //获取页面内容
                blob = new Blob(['\ufeff', css+html], { type: 'application/msword' });//一个可以存储二进制文件的容器
                url = URL.createObjectURL(blob);//获取下载url
                link = document.createElement('a');//创建链接
                link.href = url;
                link.download = '测试1';
                document.body.appendChild(link);
                if (navigator.msSaveOrOpenBlob) {
                    navigator.msSaveOrOpenBlob(blob, '测试1.doc'); // IE10-11
                }
                else {
                    link.click();
                }
                document.body.removeChild(link);
            } catch (e) {
                alert("导出失败!");
                window.close();
            }
        
        }
  </script>
 </head>
 <body>
 <button οnclick=" MakeWord()">导出word</button>
  <div id="div_test">
<table >
      <tr>
        <td>A1</td>
        <td>B1</td>
        <td>C1</td>
        <td>E1</td>
      </tr>
      <tr>
        <td>A2</td>
        <td>B2</td>
        <td>C2</td>
        <td>E2</td>
      </tr>
      <tr>
        <td>A3</td>
        <td>B3</td>
        <td>C3</td>
        <td>E3</td>
      </tr>
      <tr>
        <td>A4</td>
        <td>B4</td>
        <td>C4</td>
        <td>E4</td>
      </tr>
    </table>
  </div>
 </body>
</html>

 

 

转载于:https://my.oschina.net/u/195725/blog/1605565

你可能感兴趣的文章
各种按钮的样式
查看>>
GoJS教程[2019]:使用GraphObjects构建零件
查看>>
Java锁细节整理
查看>>
php编译安装
查看>>
正则介绍及grep/egrep用法
查看>>
锚定比特币现金(BCH),助力构建价值互联网时代
查看>>
微服务测试之接口测试和契约测试
查看>>
.NET的数学库NMath实用教程——创建复数的几种方法
查看>>
iOS-LinkLabel
查看>>
创建一个自己的MVC框架
查看>>
Docker | 第一章:Docker简介
查看>>
OSChina 周三乱弹 —— 你会 3P 吗?【PHP,JSP 和 ASP】
查看>>
OSChina 周三乱弹 ——你最想在墓碑上被写些什么
查看>>
openjdk 7编译记录
查看>>
数据结构 ConcurrentHashMap
查看>>
spring boot 初始化是怎么扫描类的
查看>>
css3实现圆形进度条
查看>>
C++学习需要看的书籍
查看>>
jQuery的常用方法
查看>>
mysql联查时为空补全和jdbc获取最后插入生成的id
查看>>