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]);
                }
            }
        }
    }    
时间: 2024-10-12 11:15:53

javascript知识点(1)的相关文章

8年javascript知识点积累

08年毕业就开始接触javascript,当时是做asp.net发现很多功能用asp.net控件解决不了,比如checkbox单选,全选问题,自动计算总价问题,刷新问题,等等.那时感觉javascript好讨厌,没有好的框架和调试工具,痛不欲生.如今javascript框架漫天飞舞,jquery,zepto,AngularJs,各种应用层出不穷,动画,游戏,单页网站,甚至手机app,那里都少不了javascript,不禁感叹,还有没有javascript不能做的事情么? 8年了,如今多半时间是管

JavaScript知识点总结之如何提高性能

先给大家巩固下javascript基本语法: javascript基本语法 定义变量统一用var关键字 语法:var 变量名称=变量值 标示符:①.由字母数字下划线构成 不能以数字开头 不能是关键字 严格区分大小写 数据类型: 数值型:number 字符串:string 布尔型:boolean 特殊数据类型:undefined 空的 未定义的 未赋值的 空值:null 引用类型object function 检测参数的数据类型:typeof()返回该数据类型对应的字符串 两个等号==和三个等号=

JavaScript知识点1

一  JS变量 1--命名: 由英文字母.数字.下划线组成,首字母为字母或下划线或美元符号$.避免使用关键字和保留字. 变量名区分大小写. 变量名两种写法: [1]驼峰命名法:首字母小写,剩下每个单词的首字母大写:单词与单词间用下划线分隔:每个单词的首字母都大写 [2]匈牙利命名法:变量名=类型+对象描述,如oBtn,o表示Object对象类型,Btn表示按钮之类的 2-- 声明 var .let.const. 未声明直接使用的变量直接成了全局变量,不推荐. Ps:var声明的变量会提前到函数体

JavaScript -- 知识点汇总

js语法 1. javascript数据类型 JavaScript拥有动态类型.这意味着相同的变量可用作不同的类型:有 字符串,数字, 布尔值, 对象, 数组,Undefined和Null 对象: var person={ firstname : "John", lastname : "Doe", id : 5566 };对象属性有两种寻址方式:name = person.lastname;name = person["lastname"]; U

初入javascript知识点(六)

正则表达式 RegExp 是正则表达式的缩写. 定义 RegExp RegExp 对象用于存储检索模式. 通过 new 关键词来定义 RegExp 对象.以下代码定义了名为 patt1 的 RegExp 对象,其模式是 "e": var patt1=new RegExp("e"); 当您使用该 RegExp 对象在一个字符串中检索时,将寻找的是字符 "e". RegExp 对象有 3 个方法: test() test() 方法检索字符串中的指定值

javascript知识点之DOM与window对象

在学习javascript过程中只是一知半解好多,碰到自己不知道属性方法,到最后都不知道自己学到了什么 js代码为什么这样写 为什么你知道这方法或属性可以这样用. DOM和window对象 DOM基本操作: 获得节点: document:通过元素ID获取节点,标签,name属性 节点指针:获取元素首个子节点,最后一个,子节点列表,兄弟节点的前一个后一个,节点的父节点 节点操作: 创建节点:创建元素节点,属性节点,文本节点 插入节点:节点的子节点添加新的子节点  已有节点前插入新子节点 替换节点:

JavaScript知识点总结

JavaScript学习总结1.JavaScript是作用于网络和HTML的一个编程语言.2.JavaScript代码必须放在<script></script>标签之间,Javascript现在是HTML默认的脚本语言,所以在<script>标签中不需要声明脚本语言为JavaScript,即不需要type="text/javascript".3.可以添加任意数量的脚本在HTML document中,JavaScript可以放在<head>

初入javascript知识点(五)

导航按钮JS var odiv =document.getElementById('nav');var listOfbtn = odiv.getElementsByTagName('button');for( var i = 0;i < listOfbtn.length;i++){ listOfbtn[i].index =i; listOfbtn[i].onclick = function(){ for(var j = 0;j < listOfbtn.length;j++){ listOfbt

初入javascript知识点(八)

jQuery性能优化 1.对于在jQuery中重复使用的标签,在第一次选择的时候就用一个变量把它保存起来. 2.在使用类名选择器时,加上父级选择器(父级选择器使用id或标签名) 3.使用find方法来选取后代 4.尽量使用jquery中的链式写法 5.使用事件委托 数据库 数据库(Database)是按照数据结构来组织.存储和管理数据的仓库. MongoDB简介 MongoDB是一个基于分布式文件存储的数据库,由C++语言编写,旨在为WEB应用提供可扩展的高性能数据存储解决方案. MongoDB

JavaScript知识点

输出<script>document.write("<h1>This is a heading</h1>");document.write("<p>This is a paragraph</p>");</script> 语句document.getElementById("demo").innerHTML="Hello World"; JavaScript