javascript - js下载div并将meta附加到html

Question

我使用以下方法将我页面中的目标标记下载为 html 文件。

function downloadInnerHtml(filename, elId, mimeType) {
    var elHtml = document.getElementById(elId).innerHTML;
    if (navigator.msSaveBlob) { // IE 10+ 
        navigator.msSaveBlob(new Blob([elHtml], { type: mimeType + ';charset=utf-8;' }), filename);
    } else {
        var link = document.createElement('a');
        mimeType = mimeType || 'text/plain';

        link.setAttribute('download', filename);
        link.setAttribute('href', 'data:' + mimeType  +  ';charset=utf-8,' + encodeURIComponent(elHtml));  

        var metaTag=document.createElement("meta");
        metaTag.name = "viewport";
        metaTag.content = "width=device-width, initial-scale=1.0, maximum-scale=1.0";        
        document.head.appendChild(metaTag);

        document.body.append(link);
        link.click(); 
        document.body.removeChild(link);
    }
}

我面临的问题是创建的输出 html 不包含元标记。

标签： javascripthtml

Answer 1

因为你只下载elHtml或encodeURIComponent(elHtml)

你需要做

var elHtml = document.getElementById(elId).innerHTML;
elHtml = `<meta..... >`+ elHtml;