HTML5 - js导出导入数据为txt/doc文件

1、js导出为txt/doc格式文件

<body>
    文件名称：
    <input id="fileName">
    <br>
    文本内容：
    <textarea id="textContent" cols="30" rows="10"></textarea>
    <br>
    <button type="button" onclick='SaveTxt()'>保存</button>
</body>
<script type="text/javascript">
    function SaveTxt() {
        var FileName = document.getElementById('fileName').value + '.txt'; // 文件名称 - 文件名称后添加“.txt”或“.doc”可以保存为对应格式
        var Content = document.getElementById('textContent').value; // 文本内容

        var element = document.createElement('a');
        element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(Content));
        element.setAttribute('download', FileName);
        element.style.display = 'none';
        document.body.appendChild(element);
        element.click();
        document.body.removeChild(element);
    }
</script>

 js导入数据

<body>
    <button type="button" onclick='ImportScheme()'>导入方案</button>
</body>
<script type="text/javascript">
    function ImportScheme() {
        var file = $('<input type="file" />');
        // 选择好文件后，获取选择的内容
        file.change(function (e) {
            openFile(e);
        })
        file.click();
    }

    function openFile(e) {
        var input = e.target;
        var reader = new FileReader();
        reader.onload = function () {
            if (reader.result) {
                console.log(reader.result);
            }
        };
        reader.readAsText(input.files[0]);
    }
</script>

 

posted @ 2020-07-07 11:09  野性狼心  阅读(2325)  评论(0)  编辑  收藏  举报