使用JS将select下拉选项保存为文本文件时内容异常如何修复

你遇到的两个异常分别由两个独立问题导致：

• 仅输出每个选项第一个单词：代码中读取的是option元素的value属性，如果你写<option>标签时没有手动补全完整的value属性（比如只写了<option>buy food</option>，没写value="buy food"），部分浏览器解析默认value时会自动截断到第一个空格位置，最终只能拿到每个选项的第一个单词。
• 所有内容显示在同一行：Windows系统自带的记事本等文本编辑器，无法识别纯文本中单独的\n换行符，必须使用\r\n作为换行标识才能正常逐行显示，你之前只用了\n，所以打开后所有内容挤在同一行。

function saveTextAsFile() {
    let textToWrite = "";
    $('#todolist>option').each(function () {
        // 如需保存选项显示的文本用$(this).text()，如需保存value属性值请替换为this.value，且确保option标签的value属性写全内容
        textToWrite += $(this).text().trim() + "\r\n";
    });

    // 增加utf-8编码声明，避免中文乱码
    const textFileAsBlob = new Blob([textToWrite], {type: 'text/plain;charset=utf-8'});
    const fileNameToSaveAs = "directive.txt";

    const downloadLink = document.createElement("a");
    downloadLink.download = fileNameToSaveAs;
    // 兼容全内核浏览器的URL创建方法
    const createUrl = window.URL?.createObjectURL || window.webkitURL.createObjectURL;
    downloadLink.href = createUrl(textFileAsBlob);

    downloadLink.click();
    // 释放创建的临时URL，避免内存泄漏
    window.URL.revokeObjectURL(downloadLink.href);
}

const saveBtn = document.getElementById('file-save');
saveBtn.addEventListener('click', saveTextAsFile);

• 如果你实际需要保存的是option的value属性值而非显示文本，请检查所有option标签的写法，确保value属性内的内容完整，例如正确写法为<option value="buy food">买食材</option>，不要省略value属性导致浏览器默认解析截断。
• 原代码中缺失了saveTextAsFile函数的声明头部，且仅适配了webkit内核浏览器的URL创建方法，修复后已兼容所有主流浏览器。

内容的提问来源于stack exchange，提问作者MrCoder74