前端下载为word

最新推荐文章于 2024-05-20 10:27:05 发布

k6丶

最新推荐文章于 2024-05-20 10:27:05 发布

阅读量649

点赞数

文章标签：前端 javascript 开发语言 js

本文链接：https://blog.csdn.net/m0_52724742/article/details/125758281

版权

前端下载为word

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div id="downLoad">
        <h3>长歌行</h3>
        <p>青青园中葵，朝露待日晞。</p>
        <p>阳春布德泽，万物生光辉。</p>
        <p>常恐秋节至，焜黄华叶衰。</p>
        <p>百川东到海，何时复西归？</p>
        <p>少壮不努力，老大徒伤悲。</p>
    </div>
    <button  onclick='handleDownLoad()'>点击下载</button>
    <script>
        function handleDownLoad(){
            const html=document.getElementById('downLoad').innerText
            const blob=new Blob([html],{
                type:'application/msword'
            })
            // 返回一个新创建的 Blob 对象，其内容由参数中给定的数组串联组成。
            const objectUrl=URL.createObjectURL(blob)
            // URL() 构造函数返回一个新创建的 URL 对象，表示由一组参数定义的 URL。
            // console.log(objectUrl)//blob:null/e8d61b42-4caf-4acf-8c51-e4bb685394d5
            const link=document.createElement('a')
            link.href=objectUrl
            let fName='做一个优秀的k6'
            link.setAttribute('download',fName)
            //下载文件名
            document.body.appendChild(link)
            link.click()

        }

    </script>
</body>

</html>