1 <!DOCTYPE html>

 2 <html>

 3 <head lang="en">

 4     <meta charset="UTF-8">

 5     <title></title>

 6 </head>

 7 <body>

 8 由于oDiv.style只能获取到行间样式，非行间样式需要用到currentStyle

 9 <div id="div1"></div>

10 <style>

11     #div1{

12         width: 100px;

13         height: 200px;/*单一样式或者简单样式*/

14         background-color: darkslategray;/*复合样式*/

15         border: 1px solid #DEDEDE;/*复合样式*/

16     }

17 </style>

18 <script>

19     window.onload=function(){

20        var oDiv1=document.getElementById("div1");

21 　　　　alert(getStyle(oDiv1, "background"));

22

23     }

24

25     function getStyle(obj, name){  //无法获取复合样式

26         if(obj.currentStyle){

27             return obj.currentStyle[name];//IE下可用

28         }else{

29             return getComputedStyle(obj, false)[name];//ff和google可用

30         }

31     }

32 </script>

33 </body>

34 </html>

javascript原生style属性分析的更多相关文章

  1. CSS和JavaScript标签style属性对照表

    CSS和JavaScript标签style属性对照表一般情况是把"-"去掉,后面字母用大写. CSS语法 (不区分大小写) JavaScript语法 (区分大小写) border ...

  2. JavaScript CSS Style属性对照表

    JavaScript CSS Style属性对照表 盒子标签和属性对照 CSS语法 (不区分大小写) JavaScript语法 (区分大小写) border border border-bottom ...

  3. JavaScript之Style属性学习

    当CSS使用伪类开始侵入DOM和JavaSCript所控制着的行为层时,DOM和JavaScript也使用他们的一系列样式去控制表现层,这篇随笔主要说的就是利用JavaScript去控制元素的表现形式 ...

  4. JavaScript原生对象属性和方法详解——Array对象

    http://www.feeldesignstudio.com/2013/09/native-javascript-object-properties-and-methods-array/ lengt ...

  5. JS中style属性

    解决办法:1.先定义一个CSS规则,然后this.className=''2.document.getElementByIdx_x("a").style.cssText=" ...

  6. style属性css与javascript对照表

    有时候会用javascript来控制标签的style,但js的style属性写法跟css有点不一样,通常是一个单词的写法不变,单词-单词属性会去掉“-”,再把第二个单词的首字母大写,估计是为了与减法运 ...

  7. jQuery? 回归JavaScript原生API

    如今技术日新月异,各类框架库也是层次不穷.即便当年漫山红遍的JQuery(让开发者write less, do more,So Perfect!!)如今也有被替代的大势.但JS原生API写法依旧:并且 ...

  8. JavaScript原生折叠扩展收缩菜单带缓冲动画

    JavaScript原生折叠扩展收缩菜单带缓冲动画 @落雨 <div id="div_two" style="display: none;"> &l ...

  9. javascript 原生常用api 数组方法大全

     <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. idea maven 依赖还原不上的问题 method <init>()V not found

    问题 还原项目依赖的时候报错: java.lang.RuntimeException: org.codehaus.plexus.component.repository.exception.Compo ...

  2. 前端1HTML

    内容概要 前端简介 HTTP简介 HTTP协议 HTML简介 head内常见标签 body内基本标签 body内特殊符号 body内常见标签 列表标签 表格标签 内容详情 前端简介 # 1.什么是前端 ...

  3. 强化学习-Windows安装gym、atari和box2d环境

    安装gym pip3 install gym pip3 install gym[accept-rom-license] 安装atari环境[可选] 下载安装VS build tools 如果出现 OS ...

  4. nifi从入门到实战（保姆级教程）——环境篇

    背景: 公司领导决定将各种基础数据的导入从代码中分离出来,用Apache Nifi替换.使开发者们更关注在业务上,而不用关心基础的由来. Apache Nifi对于整个团队都是一个全新的工具,之前大家 ...

  5. web文本划线的极简实现

    开篇 文本划线是目前逐渐流行的一个功能,不管你是小说阅读网站,还是卖教程的的网站,一般都会有记笔记或者评论的功能,传统的做法都是在文章底部加一个评论区,优点是简单,统一,缺点是不方便对文章的某一段或一 ...

  6. mysql中innodb和myisam区别

    前言 InnoDB和MyISAM是很多人在使用MySQL时最常用的两个表类型,这两个表类型各有优劣,5.7之后就不一样了. 1.事务和外键 ● InnoDB具有事务,支持4个事务隔离级别,回滚,崩溃修 ...

  7. this关键字、static关键字、方法的调用

    1.带有static关键字的方法,不可使用this关键字.因为其调用方法为类名.方法名(建议这种方式,调用不需要对象的参与),不存在对象. 2.实例方法调用必须有对象的存在,先创建对象,通过引用.的方 ...

  8. 018（Phone List）（字典树）

    题目:http://ybt.ssoier.cn:8088/problem_show.php?pid=1471 题目思路: 这不就是一个超级明显的字典树嘛 字典树,又称单词查找树,Trie树,是一种树形 ...

  9. 聊聊 C++ 大一统的初始化运算符 {}

    一:背景 最近发现 C++ 中的类型初始化操作,没有 {} 运算符搞不定的,蛮有意思,今天我们就来逐一列一下各自的用法以及汇编展现,本来想分为 值类型 和 引用类型 两大块,但发现在 C++ 中没这种 ...

  10. 使用APICloud开发app录音功能

    ​ mp3Recorder模块封装在iOS.Android下录音直接生成mp3,统一两个平台的录音生成文件,方便双平台之间的交互,减少录音完成后再转码的过程:同时提供分贝波形图显示UI:使用该模块前需 ...