<!--DOCTYPE html-->

 <html>

 <head>

 <meta charset="utf-8" />

 <style>

 *{ text-align:center;}

 input{ margin-top:30px; padding:10px 20px;}

 #div1{ width:500px; height:300px; background:red; margin:10px auto;}

 </style>

 </head>

 <body>

 <input type="button" value="style" id="btn" />

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

 <script>

 //获取非行间css样式

 function getStyle(obj,attr){    //获取非行间样式，obj是对象，attr是值

     if(obj.currentStyle){   //针对ie获取非行间样式

         return obj.currentStyle[attr];

     }else{

         return getComputedStyle(obj,false)[attr];   //针对非ie

     };

 };

 //为对象写入/获取css样式

 function css(obj,attr,value){   //对象，样式，值。传2个参数的时候为获取样式，3个是设置样式

     if(arguments.length == 2){  //arguments参数数组，当参数数组长度为2时表示获取css样式

         return getStyle(obj,attr);  //返回对象的非行间样式用上面的getStyle函数

     }else{

         if(arguments.length == 3){  //当传三个参数的时候为设置对象的某个值

             obj.style[attr] = value;

         };

     };

 };

 window.onload = function(){

     var oDiv = document.getElementById("div1");

     var oBtn = document.getElementById("btn");

     oBtn.onclick = function(){

         alert(getStyle(oDiv,"height"));

         css(oDiv,"background","green");

         alert(css(oDiv,"width"));

     };

 };

 </script>

 </body>

 </html>

js获取非行间样式或定义样式的更多相关文章

  1. js获取非行间样式/定义样式

    <!--DOCTYPE html--> <html> <head> <meta charset="utf-8" /> <sty ...

  2. JS获取非行间样式及兼容问题

    获取非行间样式: <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  3. js获取非行间样式/写入样式（行间）

    <!--DOCTYPE html--> <html> <head> <meta charset="utf-8" /> <sty ...

  4. JS获取非行间样式

    我们都知道用offset函数获取元素样式是一件很方便的事,但是offset只能获取行间样式,而无法获得非行间样式,这是它的瓶颈所在. 我们都知道js获取行间样式的方法,那么js是如何获取行距样式的呢? ...

  5. js 获取非行间样式

    1.getComputedStyle(nodeObj,false):该方法是BOM对象,第一个是要获取样式的节点对象:第二个可以写成任何的字符一般写成false或者null,这里最好是用false因为 ...

  6. JavaScript获取非行间样式/定义样式

    html节点的样式分为以下几种 (1)浏览器默认样式 (2)引用样式(引用外部css文件的样式.style标签内定义的样式) 引用外部css样式:<link rel="styleshe ...

  7. js和jquery中获取非行间样式

    样式又分为了行间样式和非行间样式.一般来说行间样式用的是比较少的,因为它能够作用的范围就只有一个元素,而非行间样式的作用范围可以是一类元素(即拥有相同德标签,或者说是有相同的类名,(当然id名不可能相 ...

  8. js兼容总结之获取非行间样式

    非行间样式案例 #div1 { width: 200px; height: 200px; background: red; } IE获取非行间样式 var oDiv = document.getEle ...

  9. 原生js提取非行间样式

    js用style属性可以获得html标签的样式,但是不能获取非行间样式,如何获取css的非行间样式呢,在低版本ie我们可以用currentStyle,在其他浏览器我们可以用getComputedSty ...

随机推荐

  1. C++学习笔记36 （模板的细节明确template specialization）和显式实例（template instantiation）

    C++有时模板很可能无法处理某些类型的. 例如: #include <iostream> using namespace std; class man{ private: string n ...

  2. 亚马逊记AWS(Amazon Web Services)自由EC2应用

    很长时间,我听到AWS能够应用,但是需要结合信用卡,最近申请了. 说是免费的,我还是扣6.28,后来我上网查了.认为是通过进行验证.像服务期满将返回. 关键是不要让我进入全抵扣信用卡支付passwor ...

  3. Android4.4 蓝牙源代码段分析

    最近GOOGLE发布时间Android4.4,我看了看源代码.4.4蓝牙打开过程或这部分的一些变化,判断蓝牙开关是从接口设置settings在里面switch开关,widget当然,它可以切换,也许启 ...

  4. [置顶] Hibernate从入门到精通（十一）多对多双向关联映射

    上次我们在中Hibernate从入门到精通(十)多对多单向关联映射讲解了一下多对多单向关联映射,这次我们讲解一下七种映射中的最后一种多对多双向关联映射. 多对多双向关联映射 按照我们之前的惯例,先看一 ...

  5. android CheckBox RadioButton 照片和文字的间距问题

    利用自身的定义CheckBox 要么RadioButton时间.定义自己的图标和文字在不同的手机显示不同的音高.有时不太好控制,下面是我自己的定义CheckBox: 在Layout在下面xml: &l ...

  6. NSIS脚本：在卸载页面收集信息

    原文 NSIS脚本:在卸载页面收集信息 此功能用于在软件卸载时收集相关信息,以便进行后续改进.实现功能如图: 以下为实现代码: 01 !include nsDialogs.nsh 02 !includ ...

  7. B/S 类项目改善

    B/S 类项目改善的一些建议   要分享的议题 性能提升:在访问量逐渐增大的同时,如何增大单台服务器的 PV2 上限,增加 TPS3 ? RESTful:相较于传统的 SOAP1,RESTful 风格 ...

  8. JavaScript循环之for/in循环

    今天学到了JavaScript的语句篇.同其他常见编程语言如C.Java等一样,JavaScript中的语句包含:①表达式语句②复合语句和空语句③声明语句④条件语句⑤循环语句⑥跳转语句,当然JavaS ...

  9. javascript系列之this

    原文:javascript系列之this 引言 在这篇文章里我们将会讨论与执行上下文直接相关的更多细节.讨论的主题就是this关键字.实践证明,这个主题是足够难的并且在不同的执行上下文中判定this的 ...

  10. HDU 1248 冰封王座（dp）

    Problem Description 不死巫妖王拉工资,死亡骑士得到N美元的钞票(记,只有一个纸币),战斗中频繁的死掉,他决定给自己买一些道具,于是他来到了地精商店前. 死亡骑士:"我要买 ...