Javascript 笔记与总结（2-9）获取运行时的 style 对象

获取内存中（正在渲染）的 style 的值（非内联 style，obj.style 只能获得内联 style 的值），可以用 obj.currentStyle（低版本 IE 和 Opera 支持）和 window.getComputedStyle（IE9 以及标准浏览器支持）来获取。

window.getComputedStyle 的格式是 window.getComputedStyle(obj,伪元素)

第一个参数是要要获取计算后的样式的目标元素

第二个参数是期望的伪元素，如"after"，"first-letter"等，一般为 null

可以封装获取运行时的 style 对象的函数

function getStyle(obj, attr){
    return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj, null)[attr];
}

注：这两个方法获取的对象是只读的，要改样式必须使用 obj.style。

【例】

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        #div1{
            width: 300px;
            height: 300px;
            background: blue;
            border-bottom: 1px solid black;
        }
    </style>
</head>

<body>
    <div id="div1" onclick="t();"></div>
</body>

<script>
    function getStyle(obj, attr){
        return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj, null)[attr];
    }

    function t(){
        var div = document.getElementById("div1");
        div.style.width = parseInt(getStyle(div, "width")) + 5 + ‘px‘;
        div.style.height = parseInt(getStyle(div, "height")) + 5 + ‘px‘;
        div.style.borderBottomWidth = parseInt(getStyle(div, "borderBottomWidth")) + 1 + ‘px‘;
    }
</script>
</html>

时间： 2024-08-06 11:53:34

Javascript 笔记与总结（2-9）获取运行时的 style 对象的相关文章

Android学习笔记（十四）——在运行时添加碎片（附源码）

在运行时添加碎片点击获取源码将UI分割为多个可配置的部分是碎片的优势之一,但其真正强大之处在于可在运行时动态地把它们添加到活动中. 1.使用上一篇创建的Fragments项目,在main.xml文件中注释掉两个<fragment>元素: 2.在FragmentActivity.java中添加下面的代码: FragmentManager fragmentManager = getSupportFragmentManager();//向活动添加碎片 FragmentTransaction fr

java获取运行时虚拟机内存情况

/** * 获取系统内存使用情况 * * @return 包含最大内存, 使用内存, 剩余内存的map对象 */ @Override public Map getXtncSyqk() { Map map = new HashMap(); long maxMem = Runtime.getRuntime().maxMemory()/1024/1024; long freeMem = Runtime.getRuntime().freeMemory()/1024/1024; long usedMem

创建运行时类的对象，调用指定的属性方法构造器

1 使用newInstance(),实际上是调用运行时空参的构造器注意构造器的权限修饰符要足够,同时必须有一个空参的构造器. 2 调用指定的属性方法构造器 package lianxi1; import java.lang.reflect.Constructor; import java.lang.reflect.Field; import java.lang.reflect.InvocationTargetException; import java.lang.reflect.Meth

java反射系列四之创建运行时类的对象

一.概念认知二.代码示例 package reflect; public class TestConstructor { public static void main(String[] args) throws Exception { TestConstructor T = new TestConstructor(); T.test(); } public void test() throws Exception{ String className = "reflect.Person&quo

使用Mono Cecil 动态获取运行时数据 (Atribute形式进行注入) -摘自网络

目录一:普通写法二:注入定义三:Weave函数四:参数构造五:业务编写六:注入调用一:普通写法 1 2 3 4 public static string GetPoint(int x, int y) { var value=x; } 哇好简单啊.其实动态获取和我们普通这样写代码是一样的,我们把要注入的代码,生成一个接收的变量就可以了. 就像上面value 一样接收,然后传递给我们自己函数就可以了. 二 :注入定义 public class WeaveService :

日志系统实战(二)-AOP动态获取运行时数据

介绍这篇距上一篇已经拖3个月之久了,批评自己下. 通过前面一篇介绍.我们通过mono反射代码,可以拿出编译好的静态数据.例如方法参数信息之类的.但实际情况是:我更需要运行时的数据,就是用户输入等外界的动态数据. 既然是动态的,那就是未知的.我们怎么通过提前注入的代码获取呢? 其实这是一个思路的问题,下面我们具体细看下. 实现一普通写法 public static string GetPoint(int x, int y) { var value=x; } 哇好简单啊.其实动态获取和我们普

获取运行时的泛型类型

public class BaseDaoImpl<T> extends HibernateDaoSupport implements BaseDao<T> { private Class clazz;//用于接收运行期泛型类型 public BaseDaoImpl(){ //获得当前类型的带有泛型类型的父类 ParameterizedType pd = (ParameterizedType) this.getClass().getGenericSuperclass(); clazz

TypeToken获取运行时泛型类型

最近正好使用到了guava的TypeToken来获取泛型类型使用方法: return new TypeToken<T>(thisClass) {}.getRawType(); 网上冲了一浪,发现关于泛型,有前人给出的总结: Java泛型有这么一种规律: 位于声明一侧的,源码里写了什么到运行时就能看到什么: 位于使用一侧的,源码里写什么到运行时都没了. 正好印证了TypeToken的实现思路: 先创建一个TypeToken<T>的匿名继承类(属于类的申明),从而 getClass(

[Effective JavaScript 笔记]第48条：避免在枚举期间修改对象

注册列表示例一个社交网络有一组成员,每个成员有一个存储其朋友信息的注册列表. function Member(name){ this.name=name; this.friends=[]; } var a=new Member('钟二'), b=new Member('张三'), c=new Member('赵四'), d=new Member('王五'), e=new Member('阮六'), f=new Member('耿七'); a.friends.push(b); b.friends