JavaScript事件解析

事件: 事件三要素: 事件源 :即dom元素或者其他对象 事件类型:事件的类型 事件监听程序 : 事件的回调函数 注册事件处理程序 1.通过设置事件目标的属性 ele.onclick = function(e){}; 注意:这种写法如有多个处理程序则会覆盖掉之前的 2.通过元素的addEventListener ele.addEventListener('click' , function(e){console.log(e.target);}); //相同的参数多次调用只注册一次 ele.removeEventListener('click',func)

客户端JS的时间线和load事件

JS的时间线 JS程序分两阶段 脚本执行阶段 —— 事件处理阶段 web浏览器创建Document对象,并开始解析Web页面,解析HTML元素和它们的文本内容后添加ELement对象和Text节点到文档中。在这个阶段document.readyState属性的值是"loding" 当HTML解析器遇到没有async和defer属性的<script>元素时,它把这些元素添加到文档中,然后执行行内和外部脚本。这些脚本会同步执行,并且在脚本下载(如果需要)和执行时解析器会暂停。这样脚本就可以用document.write()来把文本插入到输入流中。解析器恢复时这些文本会成为文档的一部分。同步脚步经常简单定义函数和注册后面使用的注册事件处理程序,但它们可以遍历和操作文档树,因为在它们执行时已经存在了。这样,同步脚本可以看到它自己<

JavaScript中的this你都知道吗

this是js中的一个关键字,其代指的对象是在程序运行时根据上下文环境确定的。this的使用场景有下面几种: 1.在全局命名空间中的this 在全局作用域下,this指代的是全局对象window。 var a =1; console.log(this.a) // 1 2.函数中的this 在函数中使用this,如果函数是作为对象的方法调用的,则this是指向调用这个方法的对象,如果函数只是普通的调用,则里面的this指向的是window对象,构造函数里的this则是指向这个新创建的对象。 作为对象的方法调用函数 var a = 0; var obj = {a : 1}; obj.getA

原生JS实现日历组件

想要实现的效果 点击日期选择框出现日历 有个日期控制栏帮助选择日期, 包括年、月、日的选择和今天 日历格子,初次点击日期选择框时显示此刻的日期,日历格子的日期应该包括这个月的所有天数,同时如果当月的1号不是周日,还应补全从周日到1号的天数。还要在这个月最后1号的后面补全到周六。 日期控制栏和日历格子的日期还有选择框里的日期的变化要是同步的。 实现思路 为了组件的可复用性,需要用面向对象的思想。 每个日历组件都是一个日历对象,主要包括日期选择框,日期控制显示栏,还有日历格子,为了保持日期控制显示栏和日历格子日期同步变化,日期控制栏和日历里面的每个格子都应该包含一个Date属性,点击日历里的格子,将格子存的Date属性作为函数参数,调用函数改变日期控制栏显示的时间。同理,日期控制栏时间变化时,也将Date属性作为参数调用函数,函数重新绘制日历格子。 上码: function Calendar(parentId)

JavaScript类和继承

Javascript中的‘类’ Javascript中并没有严格意义上的类。ES5中通过使用首字母大写的方法来模拟类。这个首字母大写的方法也被称为构造函数,其是一个函数。 构造函数前面用关键字new,则创建一个新的空对象,并用这个新对象调用这个函数。 function Person (name) { this.name = name; } var per1 = new Person('bob'); 其实方法也是对象,方法都是由Function构造函数创建的,Function由它本身创建。 三个概念 构造函数:也是一个函数,一般和关键字new配合使用,你单独调用也会不报错。其本身也是一个对象。 原型对象 : 构造函数的prototype属性指向的就是原型对象。 实例对象 : new

Javascript函数全解析

1.函数的声明定义 两种方式: 函数声明语句 function foo1(args){ var x = 'hello'; } 函数表达式 var foo2 = function(args){ var x = 'hello' }; 两种的区别: 第一种,函数的定义会在执行上下文开始执行代码之前被提升,通俗的讲,就是在函数声明语句之前就可以调用函数了。 第二种,在执行上下文开始执行代码之前,只有变量foo2会被提升,变量的初始化还在原来代码的位置,所以在函数表达式之前,foo2的值为undefined。 函数声明和定义可以嵌套到其他函数里 2.函数调用 函数声明的调用foo1(