HTML + JSは、ローカルにダウンロード映像を実現します

HTML5では、新しいプロパティをダウンロードすること<A>ノートで、ダウンロードの属性は、プロパティ値をダウンロードし、私たちはこのリンクをクリックしたとき、<A>接続をダウンロードするための属性を追加し、ファイルをダウンロードするときに私たちは、ブラウザのデフォルト名を指定することができます名前がポップアップボックスのダウンロードに表示され、ダウンロードの属性がトリガーとダウンロード操作を強制することができます

1:写真は<A>ダウンロードリンクすることによって達成することができます

<a href="test.jpg"download="图片名字"> 
     <IMG SRC = "test.jpg" ALT = ""> 
</a>の

2:aは、ダウンロードした画像を達成するためのJSを経由してトリガ

<IMGのID = "testImg" SRC = "test.jpg" ALT = ""> 
<ボタンクラス= "downloadBtn"タイプ= "ボタン" οnclick= "downloadImg()">下载图片</ボタン>
    機能downloadImg(){
         VAR IMG =のdocument.getElementById( 'testImg'); // 取得した画像、ダウンロードする
        のvar URL = img.src;                             // 取得した画像のアドレス
        VAR A =のdocument.createElement( 'A');           // Documentノードの挿入を作成
        するvar  イベント=  新しい新しい  のMouseEventに(「クリック」)            // イベントをクリックし、マウスをクリックしてシミュレート 
        a.download =「イメージ名」                   // ノードのダウンロードのプロパティ値を設定 
        = URL a.hrefを;                                  // 意志ノードのhrefに割り当てられ、srcの写真 
        a.dispatchEvent(イベントが)                         // マウスクリックイベントをトリガ
     }

 

おすすめ

転載: www.cnblogs.com/chao202426/p/11403713.html