浏览器对网页的各种兼容性问题整理——js

1、获取行间样式：
    obj.currentStyle.width  IE系列
    getComputedStyle(boj,false).width高级浏览器 IE9+

2、获取字符串第几位
        str.charAt(下标) 兼容所有浏览器
        str[小标] 兼容高级浏览器

3、DOM document object model
        获取
            get...

            children   第一层子级
            parentNode 获取父级

            firstElementChild 高级
            firstChild        低版本

            lastElementChild 高级
            lastChild        低版本

            previousElementSibling 高级
            previousSibling        低版本

            nextElementSibling 高级
            nextSibling        低版本
3、滚动距离
        window.onscroll

        document.body.scrollTop            chrome
        document.documentElement.scrollTop 非chrome
4、【事件对象】
        存储所有事件需要的东西
            event 非FF
            ev    高版本

            获取鼠标坐标
                clientX x坐标
                clientY y坐标
                cancelBubble=true;

                clientX/Y 可视区为参照物
5、【事件绑定】
        
        addEventListener   高级
        removeEventListener
            false  冒泡
            true   下沉，事件捕获
        attachEvent        IE系列
        detachEvent

        注意：工作中，事件必须绑定！

        addEventListener 问题
            return false 不能用
            oEvent.preventDefault()

        attachEvent 问题
            不能用 this

        addEvent(obj, 'click', function (){
            alert('a');
        });

        function addEvent(obj, sEv, fn)
        {
            if (obj.addEventListener)
            {
                obj.addEventListener(sEv, fn, false);
            }
            else
            {
                obj.attachEvent('on'+sEv, fn);
            }
        }

6、【解除绑定】
        removeEventListener
        detachEvent

        注意：解除绑定，函数必须起名字。
        new Function
7、【事件委托】
        1. 子级非常多
        2. 子级没创建、给未来元素加事件

        原理：找到事件源头  在父级中找触发事件子级
             oEvent.srcElement 非FF
            oEvent.target     FF
8、【ready】
        window.onload 代码 多媒体
        ready         代码

        ready document 加事件
            高级 DOMContentLoaded

            低版本 IE onreadystatechange
                document.readyState == 'complete'
9、【滚轮】
        非 FF
            onmousewheel
                wheelDelta
                    >0 上
                    <0 下

        FF
            DOMMouseScroll
                detail
                >0 下
                <0 上
10、【over 和 out 的问题】
        over
            fromElement relatedTarget

        out
            toElement   relatedTarget

        父级.contains(对象)

        不推荐
            onmouseleave out
            onmouseenter over
            不是 W3C 标准事件