摘要：回顾什么是内联样式所谓内联样式，就是通过页面元素的属性为当前元素定义样式。对象提供的属性和方法可以帮助我们获取样式的具体内容。遍历对象由于对象具有属性，返回该对象的属性的数量。方法通过获取的样式属性名，这种方式也可以通过方式进行替换。
回顾什么是内联样式
所谓内联样式，就是通过 HTML 页面元素的 style 属性为当前元素定义 CSS 样式。
以下代码示例，就是通过 style 属性定义 CSS 内联样式:
这是一个段落内容.
获取内联样式值得注意的是:
HTML 页面的结构与样式并没有有效分离
定义的 CSS 样式只针对当前元素有效
由于设置内联样式的方式是利用 HTML 页面元素的 style 属性实现的，所以获取内联样式主要是依靠 DOM 中获取属性方式实现。
Element 对象的 getAttribute() 方法获取 style 属性的值。
通过 DOM 对象 HTMLElement 的 style 属性获取。
Element 对象的 getAttribute() 方法Element 对象的 getAttribute() 方法的语法结构如下:
var value = element.getAttribute("style");
以上语法结构中调用 getAttribute() 方法的 element 表示 HTML 页面元素，传递的参数 style 表示属性名称，而返回值则是指定属性名对应的值（内联样式的声明内容）。
我们可以通过以下示例代码，学习如何通过 getAttribute() 方法获取内联样式:
这是一个段落内容.
上述示例代码的输出结果如下:
DOM 对象的 style 属性由于 DOM 规范标准中将 Document 对象定位的 HTML 页面元素解析为相应的对象，而这些对象都继承于 HTMLElement 对象。该对象提供了 style 属性，返回 CSSStyleDeclaration 对象。
我们可以通过以下示例代码，学习如何通过 HTMLElement 对象的 style 属性获取内联样式:
这是一个段落内容.
上述示例代码，通过 style 属性会得到 CSSStyleDeclaration 对象，该对象表示一个 CSS 属性键值对的集合。
CSSStyleDeclaration 对象通过 element.style 返回的是 CSSStyleDeclaration 对象。CSSStyleDeclaration 对象表示一个CSS属性键值对的集合。
CSSStyleDeclaration 对象提供的属性和方法可以帮助我们获取 CSS 样式的具体内容。
| 属性或方法 | 描述 |
|---|---|
| cssText | 声明块的文本内容。 |
| length | 属性的数量。 |
| item() | 返回属性名。 例如: nameString= styleObj.item(0) Alternative: nameString= styleObj[0] |
| getPropertyValue() | 返回属性值。例如: valString= styleObj.getPropertyValue("color") |
通过 element.style.cssText 属性获取 CSS 声明块的文本内容。
我们可以通过以下示例代码，学习如何通过 cssText 属性获取 CSS 声明块的文本内容:
这是一个段落内容.
上述示例代码的输出结果如下:
遍历 CSSStyleDeclaration 对象值得注意的是: cssText 属性返回的是 CSS 声明块的文本内容，解析操作时会比较麻烦。
由于 CSSStyleDeclaration 对象具有 length 属性，返回该对象的属性的数量。我们可以通过这一特性实现遍历 CSSStyleDeclaration 对象，从而得到所有属性名和相应的值。
我们可以通过以下示例代码，学习如何遍历 CSSStyleDeclaration 对象:
这是一个段落内容.
上述示例代码的输出结果如下:
在上述示例代码中，我们利用 CSSStyleDeclaration 对象的 length 属性控制遍历过程。
在遍历过程中，我们先利用 CSSStyleDeclaration 对象的 item() 方法得到每一个 CSSStyleDeclaration 对象的属性名，再利用 CSSStyleDeclaration 对象的 getPropertyValue() 方法根据属性名得到相应的值。
item() 方法通过 element.style.item(index) 获取 CSS 的样式属性名，这种方式也可以通过 element.style[index] 方式进行替换。换句话讲，这两种方式是等价的。
我们可以通过以下示例代码，学习对比这两种方式:
