[{"data":1,"prerenderedAt":158},["ShallowReactive",2],{"blog-\u002Fblog\u002Fscripted_css":3},{"id":4,"title":5,"body":6,"category":145,"cover":146,"csdn":146,"date":147,"description":5,"draft":148,"extension":149,"meta":150,"navigation":151,"path":152,"seo":153,"stem":154,"tags":155,"updated":146,"__hash__":157},"blog\u002Fblog\u002Fscripted_css.md","脚本化 css",{"type":7,"value":8,"toc":141},"minimark",[9,14,25,28,34,37,137],[10,11,13],"h2",{"id":12},"读写元素css属性-使用dom间接修改css","读写元素css属性 使用dom间接修改css",[15,16,21],"pre",{"className":17,"code":19,"language":20},[18],"language-text","dom.style.prop \u002F\u002F 读到的是行间的样式！\n               \u002F\u002F RW\n               \u002F\u002F bg-co  -->  bgCo     不允许-\n               \u002F\u002F float  -->  cssFloat float保留字\n               \u002F\u002F 值为字符串\n               \u002F\u002F 复合属性建议拆解：border\n","text",[22,23,19],"code",{"__ignoreMap":24},"",[26,27],"hr",{},[15,29,32],{"className":30,"code":31,"language":20},[18],"查询计算样式(最终显示样式，包括默认值)\nwindow.getComputedStyle(ele, null)  \u002F\u002F R\n                                    \u002F\u002F 返回的计算样式的值都是绝对值  1em --> 16px\n                                    \u002F\u002F IE8 no\n                                    \u002F\u002F null 可获取伪元素\n\nele.currentStyle (IE独有)  \u002F\u002F R\n                           \u002F\u002F 返回 原封不动的值\n",[22,33,31],{"__ignoreMap":24},[10,35,36],{"id":36},"封装兼容性方法",[15,38,42],{"className":39,"code":40,"language":41,"meta":24,"style":24},"language-javascript shiki shiki-themes github-dark","function getStyle(ele, pro) {\n  if (window.getComputedStyle) {\n    return window.getComputedStyle(ele, null)[pro];\n  } else {\n    return ele.currentStyle[pro];\n  }\n}\n","javascript",[22,43,44,74,83,105,117,125,131],{"__ignoreMap":24},[45,46,49,53,57,61,65,68,71],"span",{"class":47,"line":48},"line",1,[45,50,52],{"class":51},"snl16","function",[45,54,56],{"class":55},"svObZ"," getStyle",[45,58,60],{"class":59},"s95oV","(",[45,62,64],{"class":63},"s9osk","ele",[45,66,67],{"class":59},", ",[45,69,70],{"class":63},"pro",[45,72,73],{"class":59},") {\n",[45,75,77,80],{"class":47,"line":76},2,[45,78,79],{"class":51},"  if",[45,81,82],{"class":59}," (window.getComputedStyle) {\n",[45,84,86,89,92,95,98,102],{"class":47,"line":85},3,[45,87,88],{"class":51},"    return",[45,90,91],{"class":59}," window.",[45,93,94],{"class":55},"getComputedStyle",[45,96,97],{"class":59},"(ele, ",[45,99,101],{"class":100},"sDLfK","null",[45,103,104],{"class":59},")[pro];\n",[45,106,108,111,114],{"class":47,"line":107},4,[45,109,110],{"class":59},"  } ",[45,112,113],{"class":51},"else",[45,115,116],{"class":59}," {\n",[45,118,120,122],{"class":47,"line":119},5,[45,121,88],{"class":51},[45,123,124],{"class":59}," ele.currentStyle[pro];\n",[45,126,128],{"class":47,"line":127},6,[45,129,130],{"class":59},"  }\n",[45,132,134],{"class":47,"line":133},7,[45,135,136],{"class":59},"}\n",[138,139,140],"style",{},"html pre.shiki code .snl16, html code.shiki .snl16{--shiki-default:#F97583}html pre.shiki code .svObZ, html code.shiki .svObZ{--shiki-default:#B392F0}html pre.shiki code .s95oV, html code.shiki .s95oV{--shiki-default:#E1E4E8}html pre.shiki code .s9osk, html code.shiki .s9osk{--shiki-default:#FFAB70}html pre.shiki code .sDLfK, html code.shiki .sDLfK{--shiki-default:#79B8FF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}",{"title":24,"searchDepth":76,"depth":76,"links":142},[143,144],{"id":12,"depth":76,"text":13},{"id":36,"depth":76,"text":36},"前端",null,"2019-12-10",false,"md",{},true,"\u002Fblog\u002Fscripted_css",{"title":5,"description":5},"blog\u002Fscripted_css",[156],"css","TJcEWl68MOkLLlYYw3ldvg2EM2xvFtmfbSS_i02hjw8",1780076049028]