zoukankan      html  css  js  c++  java
  • Javascript 获取dom的宽度 随笔一

    javascript 中 offsetWidth 获得的并不是 真实的宽度 不等于 style.width ;
    offetWidth 实际上获得的是物体的盒模型尺寸。 包括 border padding 等尺寸。
    obj.style.width 只能获得行间样式宽度,不能获得样式表中的样式中的宽度

    获取不在行间宽度的方法

    function getStyle(obj,name){
         if(obj.currentStyle){
             return obj.currentStyle[name]; /*仅支持IE*/
          }
          else{
             return getComputedStyle(obj,false)[name]; /*w3c 标准*/
               //兼容IE和火狐  return window.getComputedStyle.getPropertyValue(name);   
           }
    }

    Dom中的getPropertyValue方法可以用来获取元素中指定的css属性值.该方法支持W3C标准.与IE中的currentStyle方法作用相同.都是根据指定的css属性名称来获取属性值.比如要获取某div的宽度是多少,文字排放text-align是怎么对齐的,以及position如何定位的.
    他们的区别是:
    1:getPropertyValue必须配合getComputedStyle方法一起使用.
    2:getPropertyValue支持W3C标准.但不支持IE浏览器,
    3:currentStyle非W3C标准.只支持IE.不能在FF等浏览器下使用.
    如果想在多浏览器里实现这种效果,必须根据判断浏览器来配合使用.我在下面会给出一个兼容IE和FF等浏览器获取元素css属性值的例子.

     
    语法:
    css_value=window.getComputedStyle.getPropertyValue(css_name)
     
    返回值:
    css_value:返回对某个css属性值的引用.如:text-align值,position值等.
     
     
    参数
    window.getComputedStyle:直接使用window对象调用getComputedStyle方法来获取所有可用的css属性.
    css_name:要获取的css属性值的名称.比如:text-align,position,background等等
  • 相关阅读:
    每日一题(文化课)一题---------19/7/30
    XXXXX,这个域名
    CF1037E. Trips
    bzoj3124: [Sdoi2013]直径 树形dp two points
    luogu P3952 时间复杂度 模拟
    AGC016D
    CF444E. DZY Loves Planting
    模拟赛
    HDU 3949 XOR [线性基|高斯消元]
    博客搬家
  • 原文地址:https://www.cnblogs.com/cestbon/p/3768736.html
Copyright © 2011-2022 走看看