我想写数据到现有的文件使用JavaScript。
我不想在主机上打印。
我想实际写入数据到abc.txt。
我读了很多回答的问题,但他们都是在主机上打印的。
在某些地方,他们给出了代码,但它不起作用。
所以请任何人可以帮助我如何实际写入数据文件。
我引用了代码,但它不工作:
给出错误:
Uncaught TypeError:非法构造函数
在chrome和
SecurityError:操作不安全。
在Mozilla
var f = "sometextfile.txt";
writeTextFile(f, "Spoon")
writeTextFile(f, "Cheese monkey")
writeTextFile(f, "Onion")
function writeTextFile(afilename, output)
{
var txtFile =new File(afilename);
txtFile.writeln(output);
txtFile.close();
}
所以我们实际上可以写数据到文件只使用Javascript或不?
我在这里找到了很好的答案,但也找到了更简单的方法。
创建blob的按钮和下载链接可以组合在一个链接中,因为link元素可以有一个onclick属性。(反过来似乎是不可能的,在按钮上添加href是行不通的。)
您可以使用bootstrap将链接设置为按钮样式,这仍然是纯javascript,除了样式。
结合按钮和下载链接还可以减少代码,因为需要的丑陋的getElementById调用更少了。
这个例子只需要点击一个按钮来创建text-blob并下载它:
<a id="a_btn_writetofile" download="info.txt" href="#" class="btn btn-primary"
onclick="exportFile('This is some dummy data.\nAnd some more dummy data.\n', 'a_btn_writetofile')"
>
Write To File
</a>
<script>
// URL pointing to the Blob with the file contents
var objUrl = null;
// create the blob with file content, and attach the URL to the downloadlink;
// NB: link must have the download attribute
// this method can go to your library
function exportFile(fileContent, downloadLinkId) {
// revoke the old object URL to avoid memory leaks.
if (objUrl !== null) {
window.URL.revokeObjectURL(objUrl);
}
// create the object that contains the file data and that can be referred to with a URL
var data = new Blob([fileContent], { type: 'text/plain' });
objUrl = window.URL.createObjectURL(data);
// attach the object to the download link (styled as button)
var downloadLinkButton = document.getElementById(downloadLinkId);
downloadLinkButton.href = objUrl;
};
</script>
当您需要脚本语言的额外处理功能时,可以使用这里的单页本地文件版本。
将下面的代码保存到一个文本文件中
将文件扩展名从'.txt'更改为'.html'
右键单击>打开…>记事本
根据需要编写文字处理程序,然后保存
双击html文件在默认浏览器中打开
结果将在黑匣子中预览,点击下载可获得结果文本文件
代码:
<!DOCTYPE HTML>
<HTML>
<HEAD>
</HEAD>
<BODY>
<SCRIPT>
// do text manipulation here
let string1 = 'test\r\n';
let string2 = 'export.';
// assemble final string
const finalText = string1 + string2;
// convert to blob
const data = new Blob([finalText], {type: 'text/plain'});
// create file link
const link = document.createElement('a');
link.innerHTML = 'download';
link.setAttribute('download', 'data.txt');
link.href = window.URL.createObjectURL(data);
document.body.appendChild(link);
// preview the output in a paragraph
const htmlBreak = string => {
return string.replace(/(?:\r\n|\r|\n)/g, '<br>');
}
const preview = document.createElement('p');
preview.innerHTML = htmlBreak(finalText);
preview.style.border = "1px solid black";
document.body.appendChild(preview);
</SCRIPT>
</BODY>
</HTML>
您可以使用Blob和URL.createObjectURL在浏览器中创建文件。所有最近的浏览器都支持这一点。
您不能直接保存您创建的文件,因为这会导致大量的安全问题,但您可以将其作为下载链接提供给用户。在支持下载属性的浏览器中,您可以通过链接的下载属性建议文件名。与任何其他下载一样,下载文件的用户将对文件名有最终决定权。
var textFile = null,
makeTextFile = function (text) {
var data = new Blob([text], {type: 'text/plain'});
// If we are replacing a previously generated file we need to
// manually revoke the object URL to avoid memory leaks.
if (textFile !== null) {
window.URL.revokeObjectURL(textFile);
}
textFile = window.URL.createObjectURL(data);
// returns a URL you can use as a href
return textFile;
};
下面是一个使用该技术保存文本区域中的任意文本的示例。
如果您希望立即启动下载,而不是要求用户单击链接,您可以使用鼠标事件来模拟鼠标单击链接,就像Lifecube的答案所做的那样。我已经创建了一个使用该技术的更新示例。
var create = document.getElementById('create'),
textbox = document.getElementById('textbox');
create.addEventListener('click', function () {
var link = document.createElement('a');
link.setAttribute('download', 'info.txt');
link.href = makeTextFile(textbox.value);
document.body.appendChild(link);
// wait for the link to be added to the document
window.requestAnimationFrame(function () {
var event = new MouseEvent('click');
link.dispatchEvent(event);
document.body.removeChild(link);
});
}, false);