- Products -


Software


NEWS


Special



- Knowledge -


Category × Tag



- Like -

公開
作成日:2022/7/15
更新日:2022/7/21

HTMLまるごとダウンロードを実装する

・今表示しているページの一部のHTML要素やHTMLのソースまるごとを保存したいケースがある。

・これに対応するための実装方法を紹介する。

使い方



<div>
    <a id="download" href="#" download="report.html" onclick="handleDownload()">ダウンロード</a>
</div>

<script>
function handleDownload() {
    var tmpobj = $("html").clone();
    tmpobj.find("#leftbar").remove(); // ダウンロードファイルに含めたくない要素を削除

    var content = tmpobj[0].outerHTML;
    var blob = new Blob([content], { "type": "text/plain" }); // mimeタイプ

    document.getElementById("download").href = window.URL.createObjectURL(blob);
}
</script>


参考


https://qiita.com/wadahiro/items/eb50ac6bbe2e18cf8813

・mimeタイプについて
https://developer.mozilla.org/ja/docs/Web/HTTP/Basics_of_HTTP/MIME_types


Category



Tag




関連記事


{{tmp.name}}

{{article.category}} {{article.title}}