`

取得css的属性值(兼容)

阅读更多

    如果某一html元素的css是从外部引入的,或者是后来加上去的,用document.getElementById('**').style是取不到正确的值。

 

//elem:元素对象 ; style:css的属性名
function getStyle(elem, style) {
    var value ;
    if (document.all) { //IE
        style = style.replace(/-([a-z])/g, function(s, a){ return a.toUpperCase(); });
        value = elem.currentStyle[style];
    } else {  //FF等
        var css = document.defaultView.getComputedStyle(elem, null);
        value = css ? css.getPropertyValue(style) : null;
    }
    return value == 'auto' ? null : value;
} 



 转自:http://bbs.51js.com/viewthread.php?tid=76359

 以供自己学习一下

分享到:
评论

相关推荐

    CSS入门教程-自学必备

    2. **属性和值**: CSS的样式规则由属性和对应的值组成。例如,`color`属性用于设置文本颜色,值可以是颜色名称(如`red`)、十六进制值(如`#FF0000`)、RGB或RGBA值等。 3. **盒模型**: CSS盒模型是理解布局的基础...

    HTML+CSS旋转特效源码

    这个属性可以接受多个值,包括`rotate()`函数,它接受一个角度参数,表示元素应该旋转多少度。例如,以下代码会让`.rotating-element`顺时针旋转360度: ```css .rotating-element { transform: rotate(360deg); }...

    CSS教程 中文版本

    3. **样式声明**:声明由属性和值组成,例如`color:red;`,它们定义了元素的特定样式。我们将学习如何编写有效的声明,并理解各种样式属性,如字体、颜色、大小、布局等。 4. **盒模型**:理解CSS盒模型对于布局至...

    Eric Meyer谈CSS项目文件

    1. **CSS基础**:Eric Meyer会深入讲解CSS的基本概念,如选择器、属性和值,以及如何通过它们来控制网页元素的样式。 2. **盒模型**:CSS盒模型是理解元素尺寸和布局的关键。Meyer会详细阐述内容、内边距、边框和...

    取得窗口大小 兼容所有浏览器的js代码.docx

    如果这两个属性的值不是数字,说明某些旧版浏览器可能不支持这些属性,此时代码会进一步检查文档的兼容模式。如果`document.compatMode`为"CSS1Compat",表示页面处于标准模式,那么宽度和高度应该通过`document....

    CSS第04天.rar

    10. **CSS自定义属性(CSS变量)**:CSS变量允许在整个文档中定义和重用样式值,便于维护和统一主题。 11. **BEM命名规范**:Block Element Modifier(BEM)是一种流行的CSS命名方法,旨在提高代码可读性和可维护性...

    CSS3 Quick Start Guide.pdf

    - **属性选择器**:允许根据元素的属性及属性值进行选择,如 `[type="text"]`。 - **伪类选择器**:如`:hover`、`:active`等,这些选择器在用户与页面交互时触发样式变化。 - **伪元素选择器**:如`::before`、`:...

    Javascript获取CSS伪元素属性的实现代码

    这段 `getStyle` 函数可以跨浏览器地获取元素的任何CSS属性值,包括伪元素的属性。当调用 `getStyle('.element', 'color')` 时,它将返回 `.element:before` 的颜色。 总的来说,通过理解CSS伪元素的概念,结合...

    Modernizr一个JavaScript库检测用户浏览器HTML5和CSS3功能

    开发者可以利用这些类名编写条件式CSS或JavaScript,以实现对不同浏览器的兼容处理。 **JavaScript开发中的应用** 在JavaScript中,Modernizr提供了一个全局的`Modernizr`对象,包含了各种测试结果。开发者可以...

    CSS网页设计基础教程

    声明由属性和值组成,如`color:red;`表示文本颜色为红色。 2. **规则集**:一个或多个声明组成一个规则集,用大括号`{}`包围,如`p {color:red; font-size:16px;}`。 3. **注释**:使用`/* ... */`添加注释,方便...

    Pro HTML5 and CSS5 Design Patterns

    1. **跨浏览器兼容性**:每一种设计模式均在主流浏览器如Chrome、Firefox、Internet Explorer、Opera及Safari上进行了彻底测试,确保其可用性。 2. **实用性**:本书内容实用,避免了理论上的探讨,而是聚焦于实际...

    DW CS6中文版零基础自学视频教程第11章 使用CSS2样式表 18节.zip

    1. **CSS基础知识**:了解CSS的基本结构,包括选择器、属性和值。例如,`p {color: red; font-size: 14px;}`,其中`p`是选择器,`color`和`font-size`是属性,`red`和`14px`是对应的值。 2. **选择器类型**:学习ID...

    CSS3实现圆角、阴影、透明效果并兼容各大浏览器

    尽管CSS3已经取得了很大的进步,但并非所有浏览器都完全支持这些特性。因此,在编写CSS时,开发者需要考虑使用浏览器前缀以确保广泛的兼容性。随着浏览器的不断更新和升级,对CSS3的支持也在逐步完善,这使得我们...

    取得窗口大小 兼容所有浏览器的js代码

    `***patMode`属性可以用来检测浏览器的文档渲染模式,如果其值为`CSS1Compat`(标准模式),则可以安全地使用`document.documentElement.clientWidth`和`document.documentElement.clientHeight`来获取视口宽度和...

    js取得DIV的top,left,width,height值.doc

    在JavaScript中,获取DOM元素(如DIV)的`top`, `left`, `width`, `height`等属性值是常见的需求,这些属性可以帮助我们精确地控制页面元素的位置和大小。以下是一些关于如何获取这些值以及相关知识的详细解释: 1....

    css教程实现div背景色渐变色代码分享

    3. **CSS 前缀**:为了确保 CSS 属性在不同浏览器中的兼容性,开发者通常会在 CSS3 属性前添加特定的前缀,如 `-moz-` 对应 Firefox、`-webkit-` 对应 Chrome/Safari、`-o-` 对应 Opera。 #### 三、示例代码分析 ...

    css3 条纹化和透明化表格Firefox下测试成功

    本篇文章主要探讨如何使用CSS3在Firefox浏览器下成功实现表格的条纹化和透明化,并讨论与浏览器兼容性相关的问题。 首先,条纹化表格通常是通过CSS3的伪类选择器`nth-of-type()`来实现的。这个选择器允许我们对HTML...

    web前端面试题及答案.pdf

    常见的 box-sizing 属性值有 content-box、border-box 和 inherit。content-box 是元素默认的宽度和高度计算方式,border-box 是将元素的内边距和边框包含在宽度和高度中。 5. Doctype 的作用 Doctype 是 HTML ...

    锋利的jquery代码

    4. 动画效果:jQuery的`animate()`函数可以创建自定义的动画效果,调整CSS属性值,如透明度、高度、宽度等。此外,还有预设的动画效果如`fadeIn()`, `slideUp()`, `slideDown()`等,使页面动态效果更加流畅。 5. ...

    想要xhtml课件的可以下来看看哦~~

    比如,所有的元素必须闭合,不允许省略结束标签,属性值必须用引号括起来等。了解这些基础规则是学习XHTML的第一步。 2. **元素与标签**:XHTML中包含了各种元素和标签,用于定义网页的结构和内容。例如,`<html>`...

Global site tag (gtag.js) - Google Analytics