zoukankan      html  css  js  c++  java
  • javascript 获取渲染样式

    渲染样式获取方法:

    iedomOjbect.currentStyle.xxx

      domOject DOM对象

      xxx 可以是属性、方法、样式属性值(写法和标准有差别)

    具体:http://www.jb51.net/shouce/dhtml/objects/currentStyle.html

    注意点:样式获取的结果包含单位。如其中,border应写为borderStyle。

    currentStyle 返回反映页面所应用的样式设置的值,但可能并不反映获取值时渲染所采用的值。例如,样式值设置为 "color:red; display:none" 的对象,将返回 currentStyle.color 为 red,尽管该对象并不在页面上渲染。也就是说,currentStyle 对象并不受渲染与否的绑定。在下面示例区的第三个例子演示了此行为。禁用的样式表也不影响 currentStyle 值。

    返回值的单位与设置对象时的单位相同。例如,若对象的颜色是以内嵌 STYLE="color:'green'" 的格式设置的,那么 object.currentStyle.color 将返回 green 而不是 #00FF00 (与绿色相等的红绿蓝十六进制值)。但是,当currentStyle 对象返回对象值的时候出现在作者所设置的对象值中的大写和多余的空白将被去掉。

    currentStyle 对象支持用户自定义的样式规则属性。

    currentStyle 对象是异步的。这意味着样式不可能被设置后马上就能查询,而是返回旧值。因此,对于含有 addImport 这样方法的想要获得所期待的 currentStyle 行为的脚本,该脚本需要包含一个调用方法的函数和一个检查currentStyle 的函数。对于需要在页面装载的时候检查当前属性的脚本,脚本必须等到 body 元素装入且页面被选然后,否则 currentStyle 的值可能不反映所显示的情况。

    标准:window.getComputedStyle(element[, pseudoElt]).getPropertyValue(cssValue)

      element 元素

      pseudoElt 可以不写或为null

      cssValue css属性

      支持ie9+

      

    扩展点(伪类)

    getComputedStyle支持伪类:

    如:window.getComputedStyle(document.getElementById(xxx),':after').content

     ie不支持直接获取伪类的属性值,故封装一个方法:

    function getStyleSheet(selector){
    var sheets=document.styleSheets,regxp=new RegExp(".*"+selector+"\s*$","i");
      for(var is=sheets.length-1;is>=0;is--){
        var rules=sheets[is].rules||sheets[is].cssRules;
        for(var ir=rules.length-1;ir>=0;ir--){
          var rule=rules[ir];
          if(rule.selectorText&&regxp.test(rule.selectorText)){
            return rule.style;
          }
        }
      }
    }

     getStyleSheet('span :after');

    未完待续。

    当记忆全部忘光,留下来的才是你自己的。
  • 相关阅读:
    物联网数据卡系统源码——物联网的主要应用领域
    一张图看懂开源许可协议,开源许可证GPL、BSD、MIT、Mozilla、Apache和LGPL的区别
    memcached对key和value的限制 memcached的key最大长度和Value最大长度
    缓存技术PK:选择Memcached还是Redis?
    .Net开源框架列表
    项目管理工具Redmine各功能测试
    DBImport V3.7版本发布及软件稳定性(自动退出问题)解决过程分享
    ASP.NET Core 折腾笔记一
    发布:.NET开发人员必备的可视化调试工具(你值的拥有)
    开源发布:VS代码段快捷方式及可视化调试快速部署工具
  • 原文地址:https://www.cnblogs.com/kai08/p/3819960.html
Copyright © 2011-2022 走看看