一直以为剪藏是保存的css链接+正文,然后控制台查看了剪藏的保存的正文发现他是提取元素的css样式加入style 理论上可以单独抽取样式不依赖大量的css文件,猜测浏览器有类似的函数可以提取 然后写了如下代码可以提取指定元素的css样式css选择器和id选择器元素样式 代码如下:
var obj={ "css":[], "id":[], "node":[]};(function(){ for(var j=0;j"+a[i].selectorText.indexOf(".")); //console.log(a[i].selectorText+"#->"+a[i].selectorText.indexOf("#")); if(typeof(a[i].selectorText)!="undefined") { try{ if(a[i].selectorText.indexOf("#")!=-1){ var selectorText = a[i].selectorText.replace("#",""); var cssText = a[i].style.cssText; obj.id.push([selectorText,cssText]); //console.log(selectorText+"->"+cssText); continue; } if(a[i].selectorText.indexOf(".")!=-1){ var selectorText = a[i].selectorText.replace(".",""); var cssText = a[i].style.cssText; obj.css.push([selectorText,cssText]); //console.log(selectorText+"->"+cssText); continue; } var selectorText = a[i].selectorText; var cssText = a[i].style.cssText; obj.node.push([selectorText,cssText]); //console.log(selectorText+"->"+cssText); //console.log(a[i].selectorText+"->"+a[i].style.cssText); }catch(err){ //console.log(err); } } } } } })()function GetIs(name,type){ //字符串方法indexOf var len = obj[type].length; for(var i=0;i =0){ return obj[type][i][1]; } }}function GetAttr(name,type){ switch(type){ case "css": return GetIs(name,"css"); break; case "id": return GetIs(name,"id"); break; case "node": return GetIs(name,"node"); break; }} function GetStyle(doc){ if(doc.id!=""){ console.log("id选择器样式->"+GetAttr(doc.id,"id")); } if(doc.css!=""){ console.log("css选择器样式->"+GetAttr(doc.css,"css")); } console.log("节点选择器样式->"+GetAttr(doc.nodeName.toLowerCase(),"node"));}console.log("css样式抽取");var a=document.getElementById("_main_body");GetStyle(a);```