使用js实现点击下载文档的功能

最新推荐文章于 2024-08-26 14:54:22 发布

天山小黎

最新推荐文章于 2024-08-26 14:54:22 发布

阅读量426

点赞数

分类专栏： JS Vue

本文链接：https://blog.csdn.net/qq_42732038/article/details/107208578

版权

Vue 同时被 2 个专栏收录

24 篇文章 1 订阅

订阅专栏

10 篇文章 0 订阅

订阅专栏

HTML部分

    <ul class="register">
        <ol class="r_right" onclick="downloadTxt()"><img id="girlTxt" src="下载内容路径" alt="替换内容">文档</ol>
    </ul>

JS部分

    function downloadTxt(){
        var txt = document.getElementById('girlTxt');//获取要下载的文档
        var url = txt.src;//获取文档地址
        var a = document.createElement('a');//创建一个a节点插入的document
        var event = new MouseEvent('click');//模拟鼠标click点击事件
        a.download='beautifulGirl';//设置a节点的download属性值
        a.href=url;//将图片的src赋值给a节点的href
        a.dispatchEvent(event);//触发鼠标点击事件
    }