插件
技术学习

技术博客

人工智能 大数据 前端开发 笔记

技术问答

IT资料下载

提供it学习资料上传下载服务

编程教程

java入门php入门人工智能入门

开发工具

在线开发环境WEBIDE

Html Python Java Php Phpcli Golang C# Nodejs C C++ Sql R Rust Ruby Dart Vb D F# Typescript Coffeescript Julia Kotlin Perl Groovy Lua Vala Ocaml Assembly Objectc Scala Erlang Pascal Swift Fortran Bash Clojure Ada Elixir Cobol Haskell Nim Racket Lisp

程序员工具箱

js压缩混淆图片压缩sqlite在线打开

开发框架

前端框架bfwuijs按需加载bfwonesoa框架bfwsoa分布式大数据框架bfwsea

离线开发环境

php集成开发包（bfwkit）

模板素材

js插件库

幻灯片人工智能数据库表单

html特效 代码库

三维粒子视觉差异动画

系统模板 系统源码

企业建站电商博客大数据人工智能

前端素材

图标图片字体视频音频

人工智能模型

人脸识别模型语音识别模型图片分类模型

面试招聘

外包技能

接外包私活按技能找人

码聊BFWIM

it人士专用及时通讯系统

IT笔试面试题库

golang笔试题php笔试题java笔试题python笔试题html前端笔试题

云空间

云桌面

专为IT技术人员打造的云电脑

域名

顶级域名注册 域名信息查询

云主机

Html空间 Php空间 Java空间 Python空间

我要吐槽
搜索
当前位置：首页/文本

html导出word、excel文档插件jquery.wordexport

html导出word、excel文档插件jquery.wordexport

html导出word、excel文档插件jquery.wordexport，可以将html内的元素导出为word文档 excel文档 甚至html文档等

使用方式：

第一步引入bfwone 加载依赖项jquery

第二步use插件

第三步配置参数

 var data = {
     fileName: "测试文档", //文档名
     fileType: ".xls", //文档类型  经测试  可以doc xls html 其他的自己去试
     isHeader: true, //是否显示页眉  *xls  不要设置页眉页脚  改为false
     isFooter: true, //是否显示页脚  *xls  不要设置页眉页脚  改为false
     header: "测试页眉", //页眉标题
     styles: $("#wordExPortCss"), //要导出的内容style
     updateExportCss: $("#updateExportCss") //需要修改导出的word样式  宽度高度 margin之类的
 }

代理示例

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <script id="bfwone" data="dep=jquery.17|filesaver&err=0" type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/bfwone.js"></script>
    <script type="text/javascript">
        bready(function() {
            use(["jquery.wordexport"], function() {
                $("a.word-export").click(function (event) {
                    var data = {
                        fileName: "测试文档", //文档名
                        fileType: ".xls", //文档类型  经测试  可以doc xls html 其他的自己去试
                        isHeader: true, //是否显示页眉  *xls  不要设置页眉页脚  改为false
                        isFooter: true, //是否显示页脚  *xls  不要设置页眉页脚  改为false
                        header: "测试页眉", //页眉标题
                        styles: $("#wordExPortCss"), //要导出的内容style
                        updateExportCss: $("#updateExportCss")//需要修改导出的word样式  宽度高度 margin之类的
                    }
                    $("#page-content").wordExport(data);
                });
            });
        });
    </script>
    <style>
    </style>
</head>
<body>
    <h3 style="text-align: center;margin:50px;"><a class="word-export" href="javascript:void(0)"> 导出xls </a></h3>
    <div id="page-content">
        <table>
            <thead>
                <th>姓名</th>
                <th>电话</th>
                <th>地址</th>
                <th>邮箱</th>
                <th>订单号</th>
            </thead>
            <tr class="">
                <td class="redCorlor">标题1标题1标题1标题1标题1标题1标题1标题1标题1</td>
                <td>标题2标题2标题2标题2标题2标题2标题2标题2标题2标题2标题2标题2标题2</td>
                <td>标题2标题2标题2标题2标题2标题2标题2标题2标题2标题2</td>
                <td>标题2标题2标题2标题2标题2标题2标题2标题2标题2标题2标题2</td>
                <td>标题5标题5标题5标题5标题5标题5标题5标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr class="bgColor">
                <td class="redCorlor">标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr class="bgColor">
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td class="redCorlor">标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr class="bgColor">
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td class="redCorlor">标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td class="redCorlor">标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td class="redCorlor">标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
            <tr>
                <td>标题1</td>
                <td>标题2</td>
                <td>标题3</td>
                <td>标题4</td>
                <td>标题5</td>
            </tr>
        </table>
    </div>
</body>
<style type="text/css" id="wordExPortCss">
    .redCorlor {
        color: red
    }

    table {
        border-collapse: collapse;
        margin: 0 auto;
        text-align: center;
        font-size: 12px;
        width: 1200px;
    }

    td {
        height: 50px;
        border: 1px solid blue;
        font-family: 宋体;
        font-weight: bold;
    }

    .bgColor {
        background: red
    }
</style>
<style type="text/css" id="updateExportCss">
@page WordSection {
    size: 1260px 500px;/*宽高*/
    margin: 30px;/*边距*/
    mso-header-margin: 20px;/*页眉距*/
    mso-footer-margin: 20px;/*页脚距*/
}
</style>
</body>
</html>


html导出word excel文档 插 件jquery.wordexport
立即下载jquery.wordexport.js查看所有js插件

网友评论0

取消

最新发现
程序员在线工具箱
BFW.WIKI 专业的互联网技术学习交流开发部署一站式平台
本站所有栏目导航

技术学习

技术博客 技术问答 技术课程 资料下载

工具环境

webide bfwstudio 工具箱 码聊 域名空间

源码模板

js插件库 html特效 代码库 开源项目 模板库 素材库

技能外包

人才技能库 项目外包 笔试题库
备案号：苏ICP备19002694号
关于我们 免责声明