html文件如何下载文件

HTML中下载文件两种方法；a标签下载；js下载;

<!--  网页地址和图片地址同源的情况下这样是可以的，不同源则是直接打开这个地址 -->
　　<!-- 方法一:同源情况下载  -->
    <header class="clearfix " style="text-align: center;">
        <a style='padding:10px;' href="http://img.caissa.com.cn/zip/2020/fyx_01/pc/sht.jpg" download="sht.jpg"> 点击下载文件 </a>
    </header>

    <!-- 方法二:不同源  将文件打包为.zip/.rar等浏览器不能打开的文件 就可下载。 -->
    <header class="clearfix " style="text-align: center;margin-top:50px;">
        <a style='padding:10px;' href="http://127.0.0.1:5500/DEMO/images/ajax上传文件.rar" download="sht.jpg"> 点击下载文件 </a>
    </header>

    <hr/>
    <!--  按钮监听又可以分为两种方法， -->
    <p> 监听按钮方法: 都要同源限制; </p>

    <p> <span id='btn1' style="color:blue;"> window.open() 下载方法 </span> </p>
    <p> <span id='btn2' style="color:blue;" >表单下载方法 </span> </p>

 $(function(){
    $('#btn1').click(function(){
       window.open('http://127.0.0.1:5500/DEMO/images/ajax上传文件.rar')
    })
    $('#btn2').click(function(){
         var $form = $("<form method='get'> </form>");
         $form.attr('action','http://127.0.0.1:5500/DEMO/images/ajax上传文件.rar')
                
         $(document.body).append($form);
         $form.submit();
    
     })

 })