如何从HTML中获取Base64字符串

How to get Base64 string out of HTML

本文关键字：获取 Base64 字符串 HTML      更新时间：2023-09-26

我有一个div，其中包含一个图像和一些文本。用户可以自定义它。修改完成后，我想将div保存为带有文本的图像。就像他截屏一样。

我可以在PHP端保存Base64字符串中的图像，但我无法从HTML中获得正确的Base64。

因此，我想知道如何使用JavaScript或jQuery从div中的HTML中获取base64。我也可以添加插件。

尝试

var elem = $("div")[0].outerHTML;
var blob = new Blob([elem], {
    "type": "text/html"
});
var reader = new FileReader();
reader.onload = function (evt) {
    if (evt.target.readyState === 2) {
        console.log(
                     // full data-uri
                     evt.target.result
                     // base64 portion of data-uri
                   , evt.target.result.slice(22, evt.target.result.length));
        // window.open(evt.target.result)
    };
};
reader.readAsDataURL(blob);

jsfiddlehttp://jsfiddle.net/guest271314/9mg5sf7o/

尝试html2canvas

http://html2canvas.hertzen.com/examples.html

html2canvas($("#div"), {
    onrendered: function(canvas) {
        var myImage = canvas.toDataURL("img/png");
        window.open(myImage);
    }
});
相关文章：