• js总结(6.1)获取DOM的各个属性 补充部分


    1.滚动条距离  

    window.pageXOffset/pageYOffset

        IE8 : document.body/documentElement.scrollLeft/scrollTop(兼容性比较混乱,用时取两个值相加,因为不可能存在两个同时有值)

       封装函数 解决兼容性问题   

      

    <script type="text/javascript">
        function getScrollOffset() {
            if(window.pageXOffset) {
                x : window.pageXoffset,
                y : window.pageYoffset
            }
            else{
                return {
                    x : document.body.scrollLeft + document.documentElement.scrollLeft,
                    y : document.body.scrollTop + document.documentElement.scrollTop,
                }
            }
        }
    </script>

        2.查看视口的尺寸 

        window.innerWidth/innerHeight 

           封装函数 解决兼容性问题

    .

    <script type="text/javascript">
        function getSViewportOffset() {
            if(window.innerWidth) {
                return {
                    w : window.innerWidth,
                    h : window.innerHeight
                }
            }else{
                if(document.compatMode ==="BackCompat") {
                    return {
                        w : document.body.clienWidth,
                        h : document.body.clientHeight
                    }
                }else{
                    return {
                        w : document.documentElement.clientWidth,
                        h : document.documrntElement.clientHeight
                    }
                }
        }
    </script>

    3、查看元素的几何尺寸:

    domEle.getBoundingClientRect(); //(返回结果不是实时的)

    4、查看元素的尺寸:

    dom.offsetWidth,dom.offsetHeight.

    5、查看元素的位置:

    dom.offsetLeft,dom.offsetTop.

    6.最终显示样式获取

    window.getComputedStyle(div, null).width

     window.getComputedStyle(div,"after").width (获取div伪元素的样式)



  • 相关阅读:
    本周开发工作时间及内容
    自我介绍
    代码规范
    结对编程
    第二周总结
    20140227WPF学习笔记
    约瑟夫问题
    模式匹配KMP算法
    .NET开发之窗体间的传值转化操作
    北达软TOGAF9鉴定级别认证考试通知 北达软
  • 原文地址:https://www.cnblogs.com/nice2018/p/9881121.html
Copyright © 2020-2023  润新知