javascript - 从网页创建 html 文件

标签 javascript jquery html file

我很难弄清楚这一点。事实上,我真的不知道从哪里开始。我需要弄清楚我的网站如何制作文件(HTML 或文本!!!),然后下载它。有点像 Google 文档如何将您的文档归档,然后您就可以下载它。代码必须采用 HTML 和 javascript 格式。 JQuery 也不错。谢谢!

最佳答案

您应该指定您想要创建的文件类型。 我制作了一个小片段,展示了如何创建纯文本和二进制(在本例中为图像)文件。

var textData = new Blob(['My file content'], {type: 'text/plain'});
var myTextFile = window.URL.createObjectURL(textData);
document.getElementById('downloadText').href = myTextFile;

var base64Data = "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";

var binaryData = atob(base64Data);
var buffer = new ArrayBuffer(binaryData.length);
var byteArray = new Uint8Array(buffer);
for (var i = 0; i < binaryData.length; i++)
    byteArray[i] = binaryData.charCodeAt(i);

var imageData = new Blob([byteArray], {type: 'image/png'});
var myImage = window.URL.createObjectURL(imageData);
document.getElementById('downloadImage').href = myImage;
<a id="downloadText" download="filename.txt">Download Text File</a><br />
<a id="downloadImage" download="image.png">Download Image</a>

关于javascript - 从网页创建 html 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31345608/

相关文章:

javascript - 为什么添加音频分析仪后声音停止播放?网络音频API

javascript - 正则表达式,替换所有以@开头的单词

javascript - 访问动态创建的元素 jQuery?

javascript - 使用 Span 触发 Bootstrap 下拉列表

jquery - HTML5 的跨浏览器可缩放图像

html - 页脚元素垂直对齐

javascript - 双感叹号是什么意思!!运算符是什么意思?

javascript - 为什么我的 event.target 不工作?

javascript - 将图像放入 HTML Canvas(适合宽度和高度)

html - 网站重新设计技巧