Bolb和URL.createObjectURL导出文件

最新推荐文章于 2024-04-25 16:15:40 发布

weixin_30486037

最新推荐文章于 2024-04-25 16:15:40 发布

阅读量359

点赞数

文章标签： xhtml

原文链接：http://www.cnblogs.com/huangtonghui/p/9881585.html

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <style>
        table {
            border-collapse: collapse
        }
    </style>
    <table border="1">
        <caption>花名册</caption>
        <tr>
            <th>姓名</th>
            <th>性别</th>
            <th>年龄</th>
        </tr>
        <tr>
            <td>张三</td>
            <td>男</td>
            <td>18</td>
        </tr>
        <tr>
            <td>李四</td>
            <td>女</td>
            <td>19</td>
        </tr>
    </table>
    <a href="">导出表格</a>
    <script>
        // bolb生成
        var table = document.getElementsByTagName('table')[0].outerHTML
        var html = "<html><head><meta charset='utf-8' /></head><body>" + table + "</body></html>"
        var blob = new Blob([html], { type: "application/vnd.ms-excel" })
        // bolb赋给a标签
        var a = document.getElementsByTagName("a")[0]
        a.href = URL.createObjectURL(blob)
        a.download = "花名册.xls"

        // Bolb导出文件格式
        /*
        'doc'        => 'application/msword',
        'bin'        => 'application/octet-stream',
        'exe'        => 'application/octet-stream',
        'so'        => 'application/octet-stream',
        'dll'        => 'application/octet-stream',
        'pdf'        => 'application/pdf',
        'ai'        => 'application/postscript',
        'xls'        => 'application/vnd.ms-excel',
        'ppt'        => 'application/vnd.ms-powerpoint',
        'dir'        => 'application/x-director',
        'js'        => 'application/x-javascript',
        'swf'        => 'application/x-shockwave-flash',
        'xhtml'        => 'application/xhtml+xml',
        'xht'        => 'application/xhtml+xml',
        'zip'        => 'application/zip',
        'mid'        => 'audio/midi',
        'midi'        => 'audio/midi',
        'mp3'        => 'audio/mpeg',
        'rm'        => 'audio/x-pn-realaudio',
        'rpm'        => 'audio/x-pn-realaudio-plugin',
        'wav'        => 'audio/x-wav',
        'bmp'        => 'image/bmp',
        'gif'        => 'image/gif',
        'jpeg'        => 'image/jpeg',
        'jpg'        => 'image/jpeg',
        'png'        => 'image/png',
        'css'        => 'text/css',
        'html'        => 'text/html',
        'htm'        => 'text/html',
        'txt'        => 'text/plain',
        'xsl'        => 'text/xml',
        'xml'        => 'text/xml',
        'mpeg'        => 'video/mpeg',
        'mpg'        => 'video/mpeg',
        'avi'        => 'video/x-msvideo',
        'movie'        => 'video/x-sgi-movie',  
        */
    </script>
</body>
</html>

转载于:https://www.cnblogs.com/huangtonghui/p/9881585.html

weixin_30486037

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Bolb和URL.createObjectURL导出文件

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equ...
复制链接

扫一扫