zoukankan      html  css  js  c++  java
  • javascript中几个兼容性问题

      对原生js掌握不好,工作中一直是使用JQ,但是用原生js写程序一直是我的目标。前段时间因为时间比较充裕,在一个小项目上使用原生js写效果,不写不知道,一写吓一跳,各种问题都出来了,今天把部分问题整理一下,记录下来。

      一、offsetWidth获取"display:none"元素的宽度时,宽度为0

      解决办法:

        1、用"visibility:hidden"代替"display:none",此时offsetWidth能获取正确的值。

        2、如果元素是使用定位的,可以通过定位把元素移出屏幕

      二、js获取css属性值,一般使用style.属性名即可,但float是特殊属性,使用style.float获取属性值无效。

      解决办法:标准浏览器使用obj.style.cssFloat,IE下使用obj.style.styleFloat

      提供一个浏览器兼容设置float属性值的函数:

    var setFloat = function(element, value) {  
        !document.all ? element.style.cssFloat = value : element.style.styleFloat = value;
    };

      三、使用style.属性名只能获取元素的内联样式,不能获取嵌入式样式和外部样式

      解决办法:标准浏览器下使用getComputedStyle、IE下使用currentStyle,可获取经过计算的最终样式

      提供一个浏览器兼容获取当前样式的函数(例如:display):

    var getDisplay = function(element) {  
        return document.all ? element.currentStyle.display : 
        document.defaultView.getComputedStyle(element, null).display;  
    };

      四、获取元素的上边界和左边界到页面的上边界和左边界的距离

      有时我们需要获取元素的上边界和左边界到页面的上边界和左边界的距离,但是js只提供了offsetLeft和offsetTop获取元素边界到其包含元素的的边界距离。我们可以通过获取该元素及其所有父级元素的offsetLeft和offsetTop,所有的偏移量之和就是我们需要的值。

      提供一个获取元素左边界到页面左边界的距离的函数:

    var getPageLeft = function(element){
        var pageLeft = 0;
        while(element)
        {
            pageLeft += element.offsetLeft;
         element = element.offsetParent; }
    return pageLeft; };
  • 相关阅读:
    JavaScript对原始数据类型的拆装箱操作
    Javascript继承(原始写法,非es6 class)
    动态作用域与词法作用域
    自行车的保养
    探索JS引擎工作原理 (转)
    C语言提高 (7) 第七天 回调函数 预处理函数DEBUG 动态链接库
    C语言提高 (6) 第六天 文件(续) 链表的操作
    C语言提高 (5) 第五天 结构体,结构体对齐 文件
    C语言提高 (4) 第四天 数组与数组作为参数时的数组指针
    C语言提高 (3) 第三天 二级指针的三种模型 栈上指针数组、栈上二维数组、堆上开辟空间
  • 原文地址:https://www.cnblogs.com/cuixi/p/3355643.html
Copyright © 2011-2022 走看看