Cree y cargue archivos de texto usando JavaScript

Cree y cargue archivos de texto usando JavaScript — Amit Merchant — Un blog sobre PHP, JavaScript y más

Hay algunos proyectos en los que necesitaba crear y cargar archivos de texto/JSON usando JavaScript. Por ejemplo, en LinkSnatch necesitaba una forma de exportar los marcadores como un archivo JSON o en mi aplicación Notepad necesitaba una forma de exportar las notas como un archivo de texto.

Uso la siguiente función para crear y cargar diferentes tipos de archivos usando JavaScript.

function saveTextAsFile(textToWrite, fileNameToSaveAs, fileType) {
    let textFileAsBlob = new Blob([textToWrite], { type: fileType });
    let downloadLink = document.createElement('a');
    downloadLink.download = fileNameToSaveAs;
    downloadLink.innerHTML = 'Download File';

    if (window.webkitURL != null) {
        downloadLink.href = window.webkitURL.createObjectURL(
            textFileAsBlob
        );
    } else {
        downloadLink.href = window.URL.createObjectURL(textFileAsBlob);
        downloadLink.onclick = destroyClickedElement;
        downloadLink.style.display = 'none';
        document.body.appendChild(downloadLink);
    }

    downloadLink.click();
}

La función es bastante simple. Toma como argumentos el texto a escribir, el nombre del archivo a guardar y el tipo de archivo. Luego crea una nueva Blob objeto con el texto y el tipo de archivo dados. Después de eso, crea una nueva a elemento y define el elemento download atributo al nombre de archivo dado.

Luego comprueba si el webkitURL el objeto está disponible en el window objeto. Si es así, utiliza el createObjectURL() método para crear una URL para el Blob objeto. De lo contrario, utiliza el URL.createObjectURL() método para crear una URL para el Blob objeto.

Luego establece el href atributo de la a elemento en la URL creada anteriormente. Después de eso, agrega el a elemento a la body elemento y haga clic en él.

Entonces, si desea crear y cargar un archivo de texto usando JavaScript, puede usar la función anterior. Por ejemplo, si desea crear y cargar un archivo de texto con el nombre hello.txt y contenido Hello World!puedes hacerlo así.

saveTextAsFile('Hello World!', 'hello.txt', 'text/plain');

Del mismo modo, si desea crear y cargar un archivo JSON con el nombre hello.json y contenido {"hello": "world"}puedes hacerlo así.

saveTextAsFile('{"hello": "world"}', 'hello.json', 'application/json');

Creé una demostración de CodePen para lo mismo.

Si quieres conocer otros artículos parecidos a Cree y cargue archivos de texto usando JavaScript puedes visitar la categoría Código.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Subir

Esta página web utiliza cookies para analizar de forma anónima y estadística el uso que haces de la web, mejorar los contenidos y tu experiencia de navegación. Para más información accede a la Política de Cookies . Ver mas