javascript知识点(1)

        var core_deletedIds = {};
        var a = core_deletedIds.toString;
         //var a=core_deletedIds.toString();  带括号是返回对象，不带返回函数
        alert(a); //function toString(){[native code]}
        var core_deletedIds = [];
        var a = core_deletedIds.push;
         //var a=core_deletedIds.push;  带括号是返回对象，不带返回函数
        alert(a); //function push(){[native code]}


        var jQuery = function() {
            return new jQuery.prototype.init();
        }
        jQuery.prototype.init = function() {
            this.show();
        };
        jQuery.prototype.show = function() {
            alert("hello");
        }
        jQuery.prototype.init.prototype = jQuery.prototype;
        window.$ = jQuery;
        $().show();

        /*
         * 惰性函数
                因为http请求每次都要去调用createXHR他里面的代码太多每次都被重新加载会影响性能
                所以如果检测到什么浏览器对应什么请求的时候就直接返回这个请求给createXHR，
        createXHR = function() {return new XMLHttpRequest();}
                等于http就请求了这么一段话而不用请求下面一大串了
        * */
        function createXHR() {
            var xhr = null;
            if (typeof XMLHttpRequest != "undefined") {
                xhr = new XMLHttpRequest();
                createXHR = function() {
                    return new XMLHttpRequest();
                }
            } else {
                try {
                    xhr = new ActiveXObject("Msxml2.XMLHTTP");
                    createXHR = function() {
                        return new ActiveXObject("Msxml2.XMLHTTP")
                    }
                } catch (e) {
                    try {
                        xhr = new ActiveXObject("Microsoft.XMLHTTP");
                        createXHR = function() {
                            return new ActiveXObject("Microsoft.XMLHTTP")
                        }
                    } catch (e) {
                        createXHR = function() {
                            return null;
                        }
                    }
                }
            }
            return xhr;
        }
        
        
        /*
         级联函数,所有要调用的函数一起写
        * */

        function classA() {
            this.lian = "";
            this.zui = "";
        }
        classA.prototype = {
            setLian: function() {
                this.lian = "大脸";
                return this; //这里要把对象返回回去他才能接着调用
            },
            setZui: function() {
                this.zui = "小嘴";
            }
        };
        var person = new classA();
         //        person.setLian();
         //        person.setZui();
        person.setLian().setZui();
        console.log(person);
        
        
        /*DOM的节点
         *标准下：包含文本和元素节点
         * 非标准下：元素节点
         * 元素节点就是ul li,属性节点就是下面的id="ul1",文本节点就是空格换行
         * nodeType==1(元素节点) nodeType==2(属性节点) nodeType==3(文本节点)
         * <ul id="ul1">
               <li>1111</li>
               <li>1111</li>
           </ul>
         */
        
        /*
         找到元素到页面的最顶部的绝对距离
         假如我这里有个这样的布局
         <div id=div1>
            <div id=div2>
               <div id=div3>
               </div>
            </div>
         </div>
         * */
        
        var iTop=0;
        var obj=div3;
        while(obj){//这个循环条件是看obj是否为null如果是就跳出
            iTop+=obj.offsetTop;//每一次都去存取当前元素离父级的距离
            obj=obj.offsetParent;//这里是变化obj的值第一次为div3,第二次为div2,第三次为div1,第四次为body,第五次就为null
        }
        
        //函数封装
        function getPos(obj){
            var pos={left:0;top:0};
            while(obj){
                pos.left+=obj.offsetLeft;
                pos.top+=obj.offsetTop;
                obj=obj.offsetParent;
            }
            return pos;
        }
        

 

/*
     关于事件绑定this指向的问题，这里把event和fn挂载到obj下，让匿名函数的this能指到这个对象下
     再如果要解绑的话才能找到对象的函数，
     * */
    window.onload=function(){
        var oDiv = document.getElementById("div1");
        var oDiv2 = document.getElementById("div2");
        oDiv2.onclick = function() {
            removeEvent(oDiv,"click", change);
        };

        function change() {alert(this);}
    
        addEvent(oDiv, "click", change);
        function addEvent(obj, event, fn) {
            obj['bind' + event] = obj['bind' + event] || [];
            //obj["bindclick"]={};  第一次返回一个对象，因为是对象才能给他加属于['bind' + fn]
            obj['bind' + event]['bind' + fn] = obj['bind' + event]['bind' + fn] || function() {
                fn.call(obj);
            }
            //obj["bindclick"]["bindchange"]=function(){fn.call(obj)};第一次
            if (typeof document.addEventListener != "undefined") {
                obj.addEventListener(event, obj['bind' + event]['bind' + fn], true);
            } else {
                obj.attachEvent('on' + event, obj['bind' + event]['bind' + fn]);
            }
        }

        function removeEvent(obj, event, fn) {
            if (obj['bind' + event] && obj['bind' + event]['bind' + fn]) {//这里查找是否有这个属于和方法
                if (typeof document.addEventListener != "undefined") {
                    obj.removeEventListener(event, obj['bind' + event]['bind' + fn], true);
                } else {
                    obj.detachEvent('on' + event, obj['bind' + event]['bind' + fn]);
                }
            }
        }
    }