一、行内样式
具体实现
在js获取到dom元素之后,使用其style属性即可获取到其所有的行内样式
<div id="div1" style="width: 100px; height: 200px"></div>
const div1 = document.getElementById('div1');
console.log(div1.style);
console.log('height:' + div1.style.height);
二、获取所有样式
具体实现
<div id="div2" class="box" style="font-size: 40px"></div>
/*demo.css*/
.box {
background-color: red;
}
const div2 = document.getElementById('div2');
console.log(document.defaultView.getComputedStyle(div2, null)); // 获取所有样式,包括内部样式、外部样式、行内样式
console.log(sty.width);
console.log(sty.backgroundColor);
console.log(sty.fontSize);