IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> 是的你没看错,js生成word文档 -> 正文阅读

[JavaScript知识库]是的你没看错,js生成word文档

用js生成word文档

查看Demo

你可以生成一份 word 文档,在此文档中可以添加多种元素并设置多种属性。

可添加的元素

  • 段落
  • 超链接
  • 标题
  • 表格
  • 列表
  • 图片

可设置的属性

  • font:字体,比如:“Microsoft YaHei UI”
  • fontSize:字体大小,比如:“44”
  • bold:true:是否加粗,true 或 false,默认不加粗
  • color:颜色,比如:“FF0000”
  • highlightColor:高亮颜色,比如:“blue”
  • italic:是否斜体,true 或 false,默认非斜体
  • underline: 下划线类型,比如:doc.UnderlineType.Wave(波浪线),默认无下划线
  • underlineColor:下划线颜色,比如:“FF0000”
  • strike:文本删除线,true 或 false
  • shadow:文本底纹颜色,比如:“FFFFFF”,默认无
  • textAlign: 文本对齐方式,比如:doc.AlignType.Center,默认两端对齐
  • lineHeight:行间距,比如:3
### 构造 DDoc 实例

var doc = new DDoc();

### 添加段落

doc.addParagraph(“添加一个段落”);

### 添加段落并设置样式

doc.addParagraph(“添加一个段落,设置字体和大小”,{
font:“Microsoft YaHei UI”,
italic:true,
underline:doc.UnderlineType.Wave,
underlineColor:“FF0000”,
strike:true,
shadow:“FFFFFF”,
textAlign:doc.AlignType.Center,
lineHeight:3
});

### 添加超链接

doc.addHyperlink(“地址”,“http://mubanmao.top”);

### 添加超链接并设置样式

doc.addHyperlink(“地址”,“http://mubanmao.top”,{
fontSize:“30”,
bold:true
});

### 添加标题

doc.addHeader(“标题1”, doc.HeaderType.H1);//H2…H7

### 添加标题并设置样式

doc.addHeader(“标题2”, doc.HeaderType.H2,{
font:“Microsoft YaHei UI”,
underline:doc.UnderlineType.Double,
color:“67ff56”,
underlineColor:“FF0000”
});


### 添加4*5的空表格

doc.addEmptyTable(4, 5);

### 添加3*3表格(有数据)并设置颜色为红色

doc.addTable([
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
],{color:“FF0000”});

### 添加表格(行列分别有合并)

//doc.Merge.CC 代表此单元格跨列合并
//doc.Merge.RC 代表此单元格跨行合并
doc.addTable([
[1, 2, 4,4,5],
[doc.Merge.CC,3, doc.Merge.RC,5,8],
[7, 8, 4,doc.Merge.CC,9],
[1, 2, doc.Merge.RC,doc.Merge.CC,5]
]);

### 添加图片

var _temp=“data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAAAmCAIAAADyTaq0AAAAAXNSR0IArs4c6QAAAAlwSFlzAAAOwwAADsMBx2+oZAAAAWFJREFUWEftVgkOhCAMVB+0L9n/f4flUGQVcIptPQIhakwpnZm2MA6f7/C8YdaQw+foHtOtgRgzZGcMOoLyHzpg7FZts0p1Io+zM0pgWuW3yZOdBX9yyqRSHAkTgsPFUwIzS+9f/3Ba1Sms2+SYt8KVsbXoA6w/ZxBLhynlyeZ/CDj8REYOCQzGtRQAyWqDRMRvgytzbu+QcsJDBUx6GmSrnAmkBYM0kdbdVASJwU0zlkq0zemxX0g8NygUOtqWNKvIE/sM2Jqsma4gsRxVaobCMN12TQAMDFJWZ45IdO1B98DA0OnKryiRwuTfg4nFwOT0KjcejHa9SoFN0qy5BUvFRvbbXDN3VBMEs6/cQBu1zZ20P9AKBENW/JIFymAE7zOWPmUwsoJtwAifasUa4wH5NmXQixEPe5Je3qaMJFe6vrsyunzju3VlcK54LWPfLZxXXRlevvm8dWX4uOT19CplfqqGCgdY+hAkAAAAAElFTkSuQmCC”;
doc.addImage(_temp,100,50,{
textAlign:doc.AlignType.Center
});

### 添加列表

doc.addList([‘第一章’, ‘第二章’, ‘第三章’],{
color:“FF0000”
});


### 添加空行

doc.newLine();

### 生成word文档

doc.generate();



## 生成一份文档的示例代码:

function generate() {
var doc = new DDoc();
doc.addParagraph(“添加一个段落”);
doc.addParagraph(“添加一个段落,设置字体和大小”,{
font:“Microsoft YaHei UI”,
italic:true,
underline:doc.UnderlineType.Wave,
underlineColor:“FF0000”,
strike:true,
shadow:“FFFFFF”,
textAlign:doc.AlignType.Center,
lineHeight:3
});
doc.addParagraph(“再添加一个段落,设置一些样式”,{
font:“Microsoft YaHei UI”,
fontSize:“44”,
bold:true,
color:“FF0000”,
highlightColor:“blue”
});

doc.addHeader("标题1", doc.HeaderType.H1);
doc.addHeader("标题2", doc.HeaderType.H2,{
    font:"Microsoft YaHei UI",
    underline:doc.UnderlineType.Double,
    color:"67ff56",
    underlineColor:"FF0000"
});

doc.addList(['第1章', '第2章', '第3章']);
doc.addList(['第一章', '第二章', '第三章'],{
    color:"FF0000"
});

doc.addEmptyTable(4, 5);
doc.newLine();
doc.addTable([
    [1, 2, 3],
    [4, 5, 6],
    [7, 8, 9]
],{color:"FF0000"});

doc.newLine();
doc.addTable([
    [1, 2, 4,4,5],
    [doc.Merge.CC,3, doc.Merge.RC,5,8],
    [7, 8, 4,doc.Merge.CC,9],
    [1, 2, doc.Merge.RC,doc.Merge.CC,5]
]);

var _temp="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAAAmCAIAAADyTaq0AAAAAXNSR0IArs4c6QAAAAlwSFlzAAAOwwAADsMBx2+oZAAAAWFJREFUWEftVgkOhCAMVB+0L9n/f4flUGQVcIptPQIhakwpnZm2MA6f7/C8YdaQw+foHtOtgRgzZGcMOoLyHzpg7FZts0p1Io+zM0pgWuW3yZOdBX9yyqRSHAkTgsPFUwIzS+9f/3Ba1Sms2+SYt8KVsbXoA6w/ZxBLhynlyeZ/CDj8REYOCQzGtRQAyWqDRMRvgytzbu+QcsJDBUx6GmSrnAmkBYM0kdbdVASJwU0zlkq0zemxX0g8NygUOtqWNKvIE/sM2Jqsma4gsRxVaobCMN12TQAMDFJWZ45IdO1B98DA0OnKryiRwuTfg4nFwOT0KjcejHa9SoFN0qy5BUvFRvbbXDN3VBMEs6/cQBu1zZ20P9AKBENW/JIFymAE7zOWPmUwsoJtwAifasUa4wH5NmXQixEPe5Je3qaMJFe6vrsyunzju3VlcK54LWPfLZxXXRlevvm8dWX4uOT19CplfqqGCgdY+hAkAAAAAElFTkSuQmCC";
doc.addImage(_temp,100,50,{
    textAlign:doc.AlignType.Center
});

doc.addHyperlink("Github地址","https://github.com/DistChen/DDoc.js",{
    fontSize:"30",
    bold:true
});

doc.generate("demo.docx");
// or
// doc.generate();

}


生成文档

源码下载

## 生成的word文档及内容如下:

![image](https://img-blog.csdnimg.cn/img_convert/c6f349b761b128f67982eb9b5ca16ab9.png)

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2022-06-29 18:55:53  更:2022-06-29 18:59:03 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/23 13:09:02-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码