<!--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. hdu 1290 竭诚为杭州电礼物50周年

    专门为杭州电50周年礼事 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) Tot ...

  2. LinkedBlockingQueue的put,add跟offer的区别(转)

    LinkedBlockingQueue的put,add和offer的区别 最近在学习<<Java并发编程实践>>,有很多java.util.concurrent包下的新类.Li ...

  3. VisualC++2012 Compiler Warning C4566

    现象: 今天敲代码突然遇到这样一个警告: warning C4566: ユニバーサル文字名 '\u0642' によって表示されている文字は.現在のコード ページ (932) で表示できません 意思是说 ...

  4. 敏感字符串加密处理（PHP实现）

    /** * 敏感字符串加密处理 * @param $raw_str 原始字符串 * @param $before 前面保留的显示位数 * @param $after 后面保留的显示位数 * @para ...

  5. JavaEE(17) - JPA查询API和JPQL

    1. 获取查询结果 2. JPQL函数和JPQL表达式 #1. 使用from子句 #2. 查询部分属性 #3. 查询中使用构造器 3. JPQL的关联查询和多态查询 #1. 多态查询 #2. 隐式连接 ...

  6. Java中间（三十五）-----Java详细设置（一个）：请指定初始容量设置

    集合是我们在Java编程中使用很广泛的,它就像大海,海纳百川,像万能容器,盛装万物.并且这个大海,万能容器还能够无限变大(假设条件同意). 当这个海.容器的量变得很大的时候,它的初始容量就会显得很重要 ...

  7. Jquery基础教程第二版学习记录

    本文仅为个人jquery基础的学习,简单的记录以备忘. 在线手册:http://www.php100.com/manual/jquery/第一章:jquery入门基础jquery知识:jquery能做 ...

  8. PHP使用MySQL数据库

    原文:PHP使用MySQL数据库 PHP使用MySQL数据库,从建立连接到结果的显示. 完整代码如下: <?php //连接MySQL $db = mysql_connect("loc ...

  9. js中document.write()使用方法

    <script>             var hrf = window.location.href;           if(hrf.indexOf('change')>0){ ...

  10. HDU 1248 冰封王座（dp）

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