1.只读与可写
getComputedStyle方法是只读的,只能获取样式,不能设置;而element.style能读能写,能屈能伸。
2.获取的对象范围
getComputedStyle方法获取的是最终应用在元素上的所有CSS属性对象(即使没有CSS代码,也会把默认的祖宗八代都显示出来);而element.style只能获取元素style属性中的CSS样式。因此对于一个光秃秃的元素<p>,getComputedStyle方法返回对象中length属性值(如果有)就是190+(据我测试FF:192,
IE9:195, Chrome:253, 不同环境结果可能有差异), 而element.style就是0。
3.作用
getComputedStyle方法有一个很重要的,类似css()方法没有的功能——获取伪类元素样式
4.兼容性
getComputedStyle方法IE6~8是不支持的

getcomputedstyle和style的区别的更多相关文章

  1. getComputedStyle/currentStyle/style之间的爱恨情仇

    getComputedStyle是? getComputedStyle是一个可以获取当前元素所有最终使用的CSS属性值.返回的是一个CSS样式声明对象([object CSSStyleDeclarat ...

  2. 获取css样式,style、getComputedStyle及currentStyle的区别

    样式表有三种: 内嵌样式:<div id="box" style="color:red">box</div>,style写在html中的 ...

  3. offsetLeft与style.left区别

    在javascript中经常遇到style.left和offsetLeft,那么它们有什么区别呢?今天我们来分析下 offsetLeft:获取当前元素相对于父元素的左侧偏移量,比如该元素设置为rela ...

  4. obj.offsetHeight与obj.style.height区别

    我们都知道obj.offsetHeight与obj.style.height都可以获取obj的高度,但是在js使用中,我们通常会使用前者来获取高度,这是为什么,二者有什么样的区别呢. 1.obj.of ...

  5. ios UITableView的style的区别与用法,以及分割线的显示与隐藏

    ******************tableview style****************************************************** // tableview ...

  6. 样式计算的几种方式与兼容写法:getComputedStyle&currentStyle&style

    window.getComputedStyle(element,[string]) 1参为需要获取样式的元素,2参指定伪元素字符串(如“::after”,不需要则为null),设置2参可获取eleme ...

  7. js中获取样式的俩种方法 style.color和style['color'] 区别

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. getComputedStyle 方法

    一:getComputedStyle getComputedStyle是一个可以获取当前元素所有最终使用的CSS属性值.返回的是一个CSS样式声明对象([object CSSStyleDeclarat ...

  9. CSSOM之getComputedStyle,currentStyle,getPropertyValue,getAttribute

    js关于CSSOM编程的样式相关几个常用的方法 webkit:getComputedStyle,getPropertyValue IE:currentStyle,getAttribute 前言 jqu ...

随机推荐

  1. 如何理解Java的值传递

    结论 为了加深印象,先把结论放在文章开头. ++Java中只有值传递++. 形参与实参 在理解Java的值传递 实参Argument 实际参数,主调用函数传递给调用函数的参数 形参Parameter ...

  2. 使用CXF开发Web Service服务

    1.使用CXF开发Web Service服务端 1.1 开发一个Web Service业务接口,该接口要用@WebService修饰 (1)创建一个Java项目MyServer (2)在MyServe ...

  3. 两种方法直接删除数组中特定值的项(JavaScript)

    一.问题详情: 直接删除意为原数组需要被改变,而不是得到另一个数组. 二.JavaScript实现 (一)巧用数组的push( ).shift( )方法 function del(arr,num) { ...

  4. 图论-网络流-最大流--POJ1273Drainage Ditches(Dinic)

    Drainage Ditches Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 91585   Accepted: 3549 ...

  5. HTML(标题/图片/链接/列表标签)

    <!DOCTYPE html> 声明 <!DOCTYPE html> 是 html5 标准网页声明,全称为 Document Type HyperText Mark-up La ...

  6. 「译」Graal JIT编译器是如何工作的

    原文Understanding How Graal Works - a Java JIT Compiler Written in Java,讲了jvmci和ideal graph的基本概念以及一些优化 ...

  7. 应用开发实践之关系型数据库(以MySql为例)小结

    本文主要是对目前工作中使用到的DB相关知识点的总结,应用开发了解到以下深度基本足以应对日常需求,再深入下去更偏向于DB本身的理论.调优和运维实践. 不在本文重点关注讨论的内容(可能会提到一些): 具体 ...

  8. <学习笔记之 JQuery>

    1. mouseenter   当鼠标指针进入(穿过)元素时,触发事件 var is_enter_help = false; $("#help-div").mouseenter(f ...

  9. Shell脚本(一)入门

    开始学习Shell脚本. #!/bin/bash ]; then echo "you are not root" else echo "you are root" ...

  10. js获取session对象