style 对象中包含支持 style 属性的元素为这个属性设置的样式信息，但不包含从其他样式表层叠继removeProperty()方法用于从元素样式中删除指定的 CSS 属性。使用这个方法删除属性意味着会 应用该属性的默认(从其他样式表层叠继承的)样式。例如，可以像下面这样删除 style 属性中设置 的 border 样式:
```js
myDiv.style.removeProperty("border");
```
在不确定给定 CSS 属性的默认值是什么的时候，可以使用这个方法。只要从 style 属性中删除，
承的同样影响该元素的样式信息。DOM2 Style 在 document.defaultView 上增加了 getComputedStyle() 方法。这个方法接收两个参数:要取得计算样式的元素和伪元素字符串(如":after")。如果不需要查 询伪元素，则第二个参数可以传 null。getComputedStyle()方法返回一个 CSSStyleDeclaration 对象(与 style 属性的类型一样)，包含元素的计算样式。假设有如下 HTML 页面:
```js
<!DOCTYPE html>
<html>
<head>
<title>Computed Styles Example</title>
<style type="text/css">
#myDiv {
background-color: blue;
width: 100px;
height: 200px;
} </style>
</head>
<body>
<div id="myDiv" style="background-color: red; border: 1px solid black"></div> </body>
</html> 26
```
这里的<div>元素从文档样式表(<style>元素)和自己的 style 属性获取了样式。此时，这个元 素的 style 对象中包含 backgroundColor 和 border 属性，但不包含(通过样式表规则应用的) width 和 height 属性。下面的代码从这个元素获取了计算样式:
1 不过，getPropertyCSSValue()方法已经被废弃，虽然可能有浏览器还支持，但随时有可能被删除。建议开发中使 用getPropertyValue
```js
let myDiv = document.getElementById("myDiv");
let computedStyle = document.defaultView.getComputedStyle(myDiv, null); console.log(computedStyle.backgroundColor); // "red"
console.log(computedStyle.width);
console.log(computedStyle.height);
console.log(computedStyle.border);
// "100px"
// "200px"
// "1px solid black"(在某些浏览器中)
```
在取得这个元素的计算样式时，得到的背景颜色是"red"，宽度为"100px"，高度为"200px"。背 景颜色不是"blue"，因为元素样式覆盖了它。border 属性不一定返回样式表中实际的 border 规则(某 些浏览器会)。这种不一致性是因浏览器解释简写样式的方式造成的，比如 border 实际上会设置一组 别的属性。在设置 border 时，实际上设置的是 4 条边的线条宽度、颜色和样式(border-left-width、 border-top-color、border-bottom-style 等)。因此，即使 computedStyle.border 在所有浏 览器中都不会返回值，computedStyle.borderLeftWidth 也一定会返回值。
关于计算样式要记住一点，在所有浏览器中计算样式都是只读的，不能修改 getComputedStyle() 方法返回的对象。而且，计算样式还包含浏览器内部样式表中的信息。因此有默认值的 CSS 属性会出现 在计算样式里。例如，visibility 属性在所有浏览器中都有默认值，但这个值因实现而不同。有些浏 览器会把 visibility 的默认值设置为"visible"，而另一些将其设置为"inherit"。不能假设 CSS 属 性的默认值在所有浏览器中都一样。如果需要元素具有特定的默认值，那么一定要在样式表中手动指定。
