JavaScript - 将字符串保存到本地计算机(文本文件、Markdown 或 HTML 文件)

文章目录

  • 将字符串保存为文本文件
  • 将字符串保存为 Markdown 文件
  • 将字符串保存为 HTML 文件
  • 参考

将字符串保存为文本文件


<html>
    <head>
        <meta charset="utf-8">
        <title>Save As Plain Texttitle>
    head>
    <body>
        <input type="button" id="button" value="Save As" />

        <script type="text/javascript">
            window.onload = function(event) {
                main()
            }

            function main() {
                const button = document.getElementById('button')
                
                button.onclick = (event) => {
                    console.log(event)
                    
                    const content = 'a plain text.'
                    const blob = new Blob([ content ], {type: "text/plain;charset=utf-8"})
                    const objectURL = URL.createObjectURL(blob)

                    const anchor = document.createElement('a')
                    anchor.href = objectURL
                    anchor.download = "plaintext.txt"
                    
                    anchor.click()

                    URL.revokeObjectURL(objectURL)
                }
            }
        script>
    body>
html>

将字符串保存为 Markdown 文件


<html>
    <head>
        <meta charset="utf-8">
        <title>Save As Markdowntitle>
    head>
    <body>
        <input type="button" id="button" value="Save As" />

        <script type="text/javascript">
            window.onload = function(event) {
                main()
            }

            function main() {
                const button = document.getElementById('button')
                
                button.onclick = (event) => {
                    console.log(event)
                    
                    const content = '# 一级标题\n## 二级标题'
                    const blob = new Blob([ content ], { type: 'text/markdown' })
                    const objectURL = URL.createObjectURL(blob)

                    const anchor = document.createElement('a')
                    anchor.href = objectURL
                    anchor.download = "markdown.md"
                    
                    anchor.click()

                    URL.revokeObjectURL(objectURL)
                }
            }
        script>
    body>
html>

将字符串保存为 HTML 文件


<html>
    <head>
        <meta charset="utf-8">
        <title>Save As HTMLtitle>
    head>
    <body>
        <input type="button" id="button" value="Save As" />

        <script type="text/javascript">
            window.onload = function(event) {
                main()
            }

            function main() {
                const button = document.getElementById('button')
                
                button.onclick = (event) => {
                    console.log(event)
                    
                    const content = "

It's a html file

"
const blob = new Blob([ content ], { type: 'text/html' }) const objectURL = URL.createObjectURL(blob) const anchor = document.createElement('a') anchor.href = objectURL anchor.download = "html.html" anchor.click() URL.revokeObjectURL(objectURL) } }
script> body> html>

参考

Web APIs - Blob

Web APIs - Blob - Blob()

The Blob Interface and Binary Data - Constructors

MIME types (IANA media types)

Media Types - text

你可能感兴趣的:(HTML,&,CSS,&,JavaScript,JavaScript)