样式操作
获取内联样式
以节点和元素的方法来获取指定的CSS样式
<body>
<div id="q1" style="width: 200px;height: 200px;border: 1px solid black"></div>
<script>
var div = document.getElementById('q1');
// 节点属性获取指定元素的属性
var attrNode = div.getAttributeNode('style');
var style = attrNode.nodeValue;
console.log(style);
var div = document.getElementById('q1');
// 元素属性获取指定的元素的属性
var style = div.getElementById('style');
console.log(style);
var div = document.getElementById('q1');
var style = div.style;
console.log(style.width);
</script>
</body>希望能够帮助大家，另外小编谢谢大家一如既往的支持，欢迎大家一起和群里的小伙伴一起学习，交流，群里面每天都有分享初学者的笔记资料，视频。点击进入暗号：知乎
CSS StyleDeclaration对象
以getPropertyVslue()方法通过elementstylestyleitem.getPropertyVslue()获取CSS样式属性值
该属性还具有length属性
<body>
<div id="q1" style="width: 200px;height: 200px;border: 1px solid black"></div>
<script>
var div = document.getElementById('q1');
var style = div.style;
// 得到CSSStyleDeclaration对象
console.log(style.cssText);
// cssText属性；获取当前元素中所有的样式属性内容(字符串类型)
console.log(style.length);
// length属性；获取当前元素中样式属性的个数(不等于与设置的个数一致)
var attrName = (style.item);
console.log(attrName);
console.log(style.getPropertyCSSValue(attrName));
// getPropertyCSSValue(Name)；获取当前元素中指定属性名对应的样式属性值
for (var attr in style) {
console.log(attr);//遍历该对象
}
</script>
</body>