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. 海量数据存储ClickHouse

    ClickHouse介绍 ClickHouse的由来和应用场景 俄罗斯Yandex在2016年开源,使用C++编写的列式存储数据库,近几年在OLAP领域大范围应用 官网:https://clickho ...

  2. 机构：DARPA

    DARPA,美国国防部高级研究计划局. 2021年3月19日,英特尔(Intel)宣布与美国国防部高级研究计划局(DARPA)达成的一项新合作,旨在推动在美制造的专用集成电路(ASIC)芯片的开发. ...

  3. 标注工具doccano导出数据为空的解决办法

    地址:https://github.com/taishan1994/doccano_export doccano_export 使用doccano标注工具同时导出实体和关系数据为空的解决办法.docc ...

  4. 使用Spring MVC开发RESTful API

    第3章 使用Spring MVC开发RESTful API Restful简介 第一印象 左侧是传统写法,右侧是RESTful写法 用url描述资源,而不是行为 用http方法描述行为,使用http状 ...

  5. OAuth2.0之OLTU实现举例

    一.场景 三个角色:用户(user),web应用(client),资源服务器和授权服务器合为服务器(server) 用户登录登录后可查看自己的信息 二.准备 2.1 数据库 schema drop t ...

  6. unity---3D数学基础

    点乘 A·B 判断敌人在前方还是后方 调试画线 画线段 前两个参数 分别是 起点 终点 画射线 前两个参数 分别是 起点 方向 Debug.DrawLine(this.transform.positi ...

  7. 【系统】查看windows系统是否永久激活

    查看windows系统是否永久激活 查看激活时间 slmgr.vbs -xpr 查看激活详情 slmgr.vbs -dlv

  8. go-zero微服务实战系列（三、API定义和表结构设计）

    前两篇文章分别介绍了本系列文章的背景以及根据业务职能对商城系统做了服务的拆分,其中每个服务又可分为如下三类: api服务 - BFF层,对外提供HTTP接口 rpc服务 - 内部依赖的微服务,实现单一 ...

  9. springboot available: expected at least 1 bean which qualifies as autowire candidate奇葩问题

    Exception encountered during context initialization - cancelling refresh attempt: org.springframewor ...

  10. JavaScript中动态生成表格

    动态生成表格,首先需要输入并获取动态的数字,html中结构代码如下:行:<input type="text" id="row" value="5 ...