内嵌样式（inline Style） ：是写在Tag里面的，内嵌样式只对所有的Tag有效。
内部样式（internal Style Sheet）：是写在HTML的<head></head>里面的，内部样式只对所在的网页有效。
外部样式表（External Style Sheet）：如果很多网页需要用到同样的样式(Styles)，将样式(Styles)写在一个以.css为后缀的CSS文件里，然后在每个需要用到这些样式(Styles)的网页里引用这个CSS文件。
不多说 上代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Document</title>
<style>
#test{width:200px;}
</style>
<script>
</script>
</head>
<body>
<div id="test">this is test content</div>
<script type="text/javascript">
var oTest = document.getElementById('test');
if(oTest.currentStyle){
alert('ie: ' + oTest.currentStyle['width']);
} else {
alert('ff: ' + window.getComputedStyle(oTest, null)['width']);
}
</script>
</body>
</html>
分享到：
相关推荐
JavaScript 用于读取HTML元素的样式有多种方法，特别是在处理内联样式之外的样式时，如内部样式表和外部样式表。以下是对`style`、`currentStyle`和`getComputedStyle`之间区别的详细解释： 1. **内联样式(Inline ...
在JavaScript中，获取CSS样式的方法主要有两种：`element.style` 和 `window.getComputedStyle()` 或 `element.currentStyle`（仅IE浏览器）。这些方法可以帮助开发者在运行时动态地读取或修改页面元素的样式。 ...
- 对于一个没有任何样式定义的元素，`window.getComputedStyle()` 返回的对象中的 `length` 属性通常表示样式属性的数量，而 `style` 对象中 `length` 的值为 0，表示没有内联样式。 - 不同的浏览器对 `CurrentStyle...
总结来说，`style` 是用于处理内联样式，`currentStyle` 提供了元素的最终计算样式，包括所有来源的样式，而 `runtimeStyle` 则用于临时地、高优先级地修改元素样式，这种修改不持久，只在运行时有效。在跨浏览器的...
这个方法尤其有用，因为CSS可以有内联样式、内部样式表（`<style>`标签）、外部样式表和浏览器默认样式，`getComputedStyle`会综合考虑所有这些来源，返回最终应用在元素上的样式。 描述中提到“脚本中设置和获取某...
而对于外部样式表，通常需要使用`currentStyle`或`getComputedStyle`方法获取样式，但无法直接修改，需切换到内联样式进行修改。 接下来，我们讨论如何用JavaScript动态创建DOM元素。动态创建DOM元素是实现网页动态...
它允许开发者读取或修改元素的内联样式。需要注意的是，`style`属性支持的CSS属性名需要转换为驼峰式写法。 **基本用法：** ```javascript // 获取元素 let div1 = document.getElementById("div1"); // 设置边框...
描述部分概括了文章内容的主要方向，即通过JavaScript读取和设置文档元素的样式属性，文章将介绍相关的方法和原理，供读者参考。 标签“javaScript 样式属性”强调了文章内容的专业领域，即JavaScript语言和其操作...
在JavaScript中，对CSS样式的读取和设置是常见的需求，尤其在动态更新网页样式时。本文将深入探讨如何使用原生JavaScript实现这一功能。 首先，我们来看获取样式的几种方法： 1. **DOM Style对象**：这是最基础的...
在JavaScript中，通过元素的style属性获取的是元素内联样式，无法直接获取到通过CSS规则定义的样式。为了解决这一问题，我们可以使用IE浏览器中的currentStyle属性和非IE浏览器中的getComputedStyle()方法来获取非行...
总的来说，JavaScript 读取元素的 CSS 信息是前端开发中的常见任务，通过 `getComputedStyle()` 和 `currentStyle` 属性，我们可以获取元素的完整计算样式。然而，理解这些方法的限制以及如何处理返回的值对于编写...
JavaScript 获取元素CSS样式的知识点详解 在Web开发中，...通过`element.style`和`window.getComputedStyle`（或`element.currentStyle`），开发者可以灵活地读取和控制网页的样式表现，实现丰富的交互效果。
- **获取样式**：若要获取通过外部样式表设置的样式，可以使用`window.getComputedStyle(element)`或`element.currentStyle`（IE特有）方法，它们会返回元素的计算样式，包括外部样式表的影响。 总结来说，...
首先，JavaScript 可以直接访问 HTML 元素的 `style` 属性，例如 `document.getElementById("main").style.backgroundColor`，这让我们能够读取或设置某个元素的内联样式。然而，当样式定义在外部 CSS 文件或 `...
3. 样式表设置的（内部或外部CSS）：无论是在内部`<style>`标签还是外部`.css`文件中定义的样式，优先级低于内联样式和JavaScript设置。 4. 浏览器默认设置的：如果以上都没有定义，则使用浏览器的默认样式。 理解...
其次，如果需要获取或设置那些不是内联的CSS属性值（例如，通过CSS样式表定义的属性），我们可以使用`currentStyle`属性（仅限IE浏览器）或者`getComputedStyle`方法（标准方法，适用于所有现代浏览器）： ...