我想写数据到现有的文件使用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或不?


当前回答

使用上面用户@useless-code (https://stackoverflow.com/a/21016088/327386)的代码来生成文件。 如果你想自动下载文件,将刚刚生成的textFile传递给这个函数:

var downloadFile = function downloadURL(url) {
    var hiddenIFrameID = 'hiddenDownloader',
    iframe = document.getElementById(hiddenIFrameID);
    if (iframe === null) {
        iframe = document.createElement('iframe');
        iframe.id = hiddenIFrameID;
        iframe.style.display = 'none';
        document.body.appendChild(iframe);
    }
    iframe.src = url;
}

其他回答

您可以使用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);

如果你谈论的是浏览器javascript,出于安全原因,你不能直接将数据写入本地文件。HTML 5的新API只允许你读取文件。

但如果要写入数据,并使用户能够以文件的形式下载到本地。下面的代码工作:

    function download(strData, strFileName, strMimeType) {
    var D = document,
        A = arguments,
        a = D.createElement("a"),
        d = A[0],
        n = A[1],
        t = A[2] || "text/plain";

    //build download link:
    a.href = "data:" + strMimeType + "charset=utf-8," + escape(strData);


    if (window.MSBlobBuilder) { // IE10
        var bb = new MSBlobBuilder();
        bb.append(strData);
        return navigator.msSaveBlob(bb, strFileName);
    } /* end if(window.MSBlobBuilder) */



    if ('download' in a) { //FF20, CH19
        a.setAttribute("download", n);
        a.innerHTML = "downloading...";
        D.body.appendChild(a);
        setTimeout(function() {
            var e = D.createEvent("MouseEvents");
            e.initMouseEvent("click", true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
            a.dispatchEvent(e);
            D.body.removeChild(a);
        }, 66);
        return true;
    }; /* end if('download' in a) */



    //do iframe dataURL download: (older W3)
    var f = D.createElement("iframe");
    D.body.appendChild(f);
    f.src = "data:" + (A[2] ? A[2] : "application/octet-stream") + (window.btoa ? ";base64" : "") + "," + (window.btoa ? window.btoa : escape)(strData);
    setTimeout(function() {
        D.body.removeChild(f);
    }, 333);
    return true;
}

使用它:

下载('文件的内容','filename.txt', 'text/plain');

const data = {name: 'Ronn', age: 27};              //sample json
const a = document.createElement('a');
const blob = new Blob([JSON.stringify(data)]);
a.href = URL.createObjectURL(blob);
a.download = 'sample-profile';                     //filename to download
a.click();

在这里检查Blob文档- Blob MDN为文件类型提供额外的参数。默认情况下,它将生成.txt文件

使用上面用户@useless-code (https://stackoverflow.com/a/21016088/327386)的代码来生成文件。 如果你想自动下载文件,将刚刚生成的textFile传递给这个函数:

var downloadFile = function downloadURL(url) {
    var hiddenIFrameID = 'hiddenDownloader',
    iframe = document.getElementById(hiddenIFrameID);
    if (iframe === null) {
        iframe = document.createElement('iframe');
        iframe.id = hiddenIFrameID;
        iframe.style.display = 'none';
        document.body.appendChild(iframe);
    }
    iframe.src = url;
}

上面的答案是有用的,但是,我找到了代码,它可以帮助你直接下载文本文件点击按钮。 在此代码中,您还可以更改文件名,如您所愿。它是纯javascript功能与HTML5。 对我有用!

function saveTextAsFile()
{
    var textToWrite = document.getElementById("inputTextToSave").value;
    var textFileAsBlob = new Blob([textToWrite], {type:'text/plain'});
    var fileNameToSaveAs = document.getElementById("inputFileNameToSaveAs").value;
      var downloadLink = document.createElement("a");
    downloadLink.download = fileNameToSaveAs;
    downloadLink.innerHTML = "Download File";
    if (window.webkitURL != null)
    {
        // Chrome allows the link to be clicked
        // without actually adding it to the DOM.
        downloadLink.href = window.webkitURL.createObjectURL(textFileAsBlob);
    }
    else
    {
        // Firefox requires the link to be added to the DOM
        // before it can be clicked.
        downloadLink.href = window.URL.createObjectURL(textFileAsBlob);
        downloadLink.onclick = destroyClickedElement;
        downloadLink.style.display = "none";
        document.body.appendChild(downloadLink);
    }

    downloadLink.click();
}