[英]javascript getComputedStyle, but not inherited ones (in chrome)
我只想获取页面上元素的计算样式 , 而没有所有继承的样式
var allElements = document.querySelectorAll( '*' );
for (var i=0;i<allElements.length;i++){
var element = allElements[i];
var css = getComputedStyle(element);
}
这显然得到了所有样式的巨大清单。
我只需要在“显示继承的”复选框被禁用时将在Chrome的检查器中显示的“计算样式” 。
这是什么JS?
编辑 :
我基本上是想保存在Chrome检查器中修改过的所有CSS。 我在页面上布置东西,并且在玩字体和元素放置(拖动jQuery可拖动对象周围)。 我想保存所有内容的位置和CSS。 也许我做的太复杂了,有一种简单的方法可以将所有修改后的样式保存在Chrome检查器中?
尝试获取元素及其父元素的计算样式,然后删除相同的属性:
var elems = document.getElementsByTagName('*');
var data = '';
for(var n=0;n<elems.length;n++){
if(elems[n].parentNode.tagName){
data+=elems[n].tagName + ': ' + elems[n].className+'\n';
var style = [];
var prStyle = [];
var result = [];
var css = window.getComputedStyle(elems[n], null);
var prCss = window.getComputedStyle(elems[n].parentNode, null);
for(var i=0;i<css.length;i++){
if(css.getPropertyValue(css[i])){
style[i] = css[i]+':'+css.getPropertyValue(css[i]);
}
}
for(var i=0;i<prCss.length;i++){
if(prCss.getPropertyValue(prCss[i])){
prStyle[i] = prCss[i]+':'+prCss.getPropertyValue(prCss[i]);
}
}
for(var i=0;i<style.length;i++){
if(style[i]!=prStyle[i]){
result.push(style[i]);
}
}
for(var i=0;i<result.length;i++) data+=i+':'+result[i]+'\n';
}
data+='-----------------------\n';
}
return data;
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.