js获取html的内容包括css和图片

js获取html的内容包括css和图片

 function handleImg(){
    let imgArr=document.getElementsByTagName("img");
    return Promise.all([...imgArr].map((item,index)=>{
        return getImgSrc(item.src).then(data=>{
            imgArr[index].src=data
        })
    })).then(()=>{
        return handleContent()
    })
}
function handleContent(){
    let htmlC=document.querySelector("html").outerHTML;
    let index=htmlC.indexOf("</head>");
    let pre=htmlC.slice(0,index);
    let aft=htmlC.slice(index);
    //获取css内容
    var style=document.styleSheets;
    let cssC="";
    for(let i=0;i<style.length;i++){
        let item=[...style[i].cssRules];
        cssC+=item.reduce((p,c)=>{
           return p+=c.cssText
        },"")
    }
    return pre+"<style>"+cssC+"</style>"+aft;
}
function getImgSrc(src){
    let img=new Image();
    img.setAttribute("crossOrigin","");
    img.src=src;
    let canvas=document.createElement("canvas");
    return new Promise((resolve)=>{
        img.onload=function(){
            canvas.width=img.width;
            canvas.height=img.height;
            let context=canvas.getContext("2d");
            context.drawImage(img,0,0,img.width,img.height);
            resolve(canvas.toDataURL())
        }
    })
}