浅谈JavaScript之事件(上)

一简述JavaScript及其在浏览器中的地位 (一) 浏览器主要构成虽然不同浏览器之间存在差异(如Google Chrome,Firefox,Safari和IE等),但单从浏览器构成来说,大同小异,大致可归结为如下几类: 1.User Interface(用户界面):所谓用户界面,就是通过浏览器渲染出来,让用户可见的界面,如地址栏,书签菜单栏等: 2.Browser Engine(浏览器引擎):主要操作呈现的引擎界面: 3.Rendering Engine(渲染引擎):负责渲染响应请求…

浅谈JavaScript的事件（事件处理程序）

事件就是用户或者浏览器自身执行的某种动作.诸如click.load和mouseover,都是事件的名字.而响应某个事件的函数就叫事件处理程序.事件处理程序的名字以"on"开头,比如click事件的事件处理程序是onclick.为事件指定事件处理程序的方式有多种方式. HTML事件处理程序元素支持的事件,都可以使用与相应事件处理程序同名的HTML特性来指定.这个特性的值能支持一定的JavaScript代码.例如,在单击按钮的时候执行一些JavaScript代码. <div id=…

浅谈JavaScript的事件（事件模拟）

事件经常由操作或者通过浏览器功能触发,通过JavaScript也可以触发元素的事件.通过JavaScript触发事件,也称为事件的模拟. DOM中事件模拟可以document的createEvent方法创建event对象.这个方法接收一个参数,即表示要创建的事件类型的字符串.在DOM2级中,所有这些字符串都使用英文复数形式,在DOM3级中都变成了单数.这几个字符串如下:UIEvents,一般化的ui事件,鼠标事件和键盘事件都继承于该事件,在DOM3级中是UIEvent:MouseEvents,…

浅谈javascript中事件冒泡与事件捕获

事件冒泡:一个事件会顺着他的层级一直往上传,一直传到document上为止,即从盒模型上看是从内到外的过程. 例: <!DOCTYPE html><html lang="en" onclick="alert('html')"><head> <meta charset="UTF-8"> <title>事件流</title><style type="text/cs…

浅谈JavaScript的事件响应

原文出处: Christian Heilmann 译文出处:Chajn Science 每当猴子们问我JavaScript和DOM里啥东西最牛逼时,我都会一巴掌打回去:卧槽还用问么当然是事件响应了啊!没它你能有时间和我讨论这个?你早去工地搬砖去了好么!浏览器没有事件响应就没有行为交互,那简直就是一夜回到解放前的感觉啊.此外,以事件驱动使得功能解耦也是个相当高端大气的技巧了,嘛,以此为主的Node.js 现在可是风生水起的说. 那现在我们就再抠抠事件监听的相关基础,让大家在心情愉悦的状态下获得…

浅谈JavaScript的事件（事件类型）

Web浏览器能够发生的事件有很多种类型,不同的事件类型有不同的事件信息.DOM3级的事件类型主要包括:UI事件,用户与页面上的元素交互时触发:焦点事件,元素获得或失去焦点触发:鼠标事件,用户通过鼠标在页面上执行操作时触发:滚轮事件,使用鼠标滚轮时触发:文本事件,当在文档中输入文本时触发:键盘事件,用户通过键盘在页面上操作触发:合成事件,当为IME输入字符时触发:变动事件,底层DOM结构发生变化时触发. UI事件 UI事件的触发并不一定是由用户操作触发的,包括:load,页面完全加载后在windo…

浅谈JavaScript的事件（事件对象）

在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含这所有与事件有关的信息.包括导致事件的元素.事件的类型和事件的相关信息.例如鼠标操作的事件中,会包含鼠标的位置信息.而键盘触发的事件会包含与按下的键有关信息.所有浏览器都支持event对象,但支持方式不同. DOM中的事件对象兼容dom的浏览会将一个event对象传递到事件处理程序中. var aa=document.getElementById("aa"); aa.onclick=function(event)…

浅谈JavaScript的事件（事件委托）

事件处理程序为Web程序提供了系统交互,但是如果页面中的事件处理程序太多,则会影响页面的性能.每个函数都是对象,都会占用内存,内存中对象越多,性能越差.需要事先为DOM对象指定事件处理程序,导致访问DOM的次数增多,会延迟整个页面的交互就绪时间. 事件委托对事件处理程序过多的解决方案是使用事件委托.事件委托利用了事件冒泡,只指定一个事件处理程序,就可以管理某一类型的所有事件.比如click事件会一直冒泡到document,也就是说我们只需为整个页面指定一个onclick事件处理程序,而不必为每…

浅谈JavaScript的事件（事件流）

事件流描述的是从页面中接收事件的顺序.IE的事件流失事件冒泡,而Netspace的事件流失事件捕获. 事件冒泡 IE的事件流叫事件冒泡,即事件开始时,由具体的元素(文档中嵌套层次最深的节点)接收,然后向上传播到不具体的节点. <html onclick="console.log('html')"> <head> <meta charset="UTF-8"> <title></title> </hea…

浅谈javascript函数节流

浅谈javascript函数节流什么是函数节流? 函数节流简单的来说就是不想让该函数在很短的时间内连续被调用,比如我们最常见的是窗口缩放的时候,经常会执行一些其他的操作函数,比如发一个ajax请求等等事情,那么这时候窗口缩放的时候,有可能连续发多个请求,这并不是我们想要的,或者是说我们常见的鼠标移入移出tab切换效果,有时候连续且移动的很快的时候,会有闪烁的效果,这时候我们就可以使用函数节流来操作.大家都知道,DOM的操作会很消耗或影响性能的,如果是说在窗口缩放的时候,为元素绑定大量的dom操…

浅谈JavaScript中的闭包

浅谈JavaScript中的闭包在JavaScript中,闭包是指这样一个函数:它有权访问另一个函数作用域中的变量. 创建一个闭包的常用的方式:在一个函数内部创建另一个函数. 比如: function compareByProperty(propertyName){ returnfunction(obj1,obj2){ return obj1[propertyName] - obj2[propertyName]; } } 该例中,compareByProperty内部的匿名函数有权利访问c…

浅谈JavaScript浮点数及其运算

原文:浅谈JavaScript浮点数及其运算 JavaScript 只有一种数字类型 Number,而且在Javascript中所有的数字都是以IEEE-754标准格式表示的.浮点数的精度问题不是JavaScript特有的,因为有些小数以二进制表示位数是无穷的. 十进制二进制 0.1 0.0001 1001 1001 1001 ... 0.2 0.0011 0011 0011 0011 ... 0…

浅谈 JavaScript 编程语言的编码规范

对于熟悉 C/C++ 或 Java 语言的工程师来说,JavaScript 显得灵活,简单易懂,对代码的格式的要求也相对松散.很容易学习,并运用到自己的代码中.也正因为这样,JavaScript 的编码规范也往往被轻视,开发过程中修修补补,最终也就演变成为后续维护人员的恶梦.软件存在的长期价值直接与编码的质量成比例.编码规范能帮助我们降低编程中不必要的麻烦.而 JavaScript 代码是直接发送给客户浏览器的,直接与客户见面,编码的质量更应该受到关注. 本文浅谈 JavaScript 编程中关…

浅谈javascript的原型及原型链

浅谈javascript的原型及原型链这里,我们列出原型的几个概念,如下: prototype属性 [[prototype]] __proto__ prototype属性只要创建了一个函数,就会为该函数创建一个prototype属性,指向该函数的原型对象.实例对象是不会拥有该属性的.默认情况下,该原型对象也会获得一个constructor属性,该属性包含一个指针,指向prototype属性所在的函数. Person.prototype.constructor===Person [[proto…

[转载]浅谈JavaScript函数重载

原文地址:浅谈JavaScript函数重载作者:ChessZhang 上个星期四下午,接到了网易的视频面试(前端实习生第二轮技术面试).面了一个多小时,自我感觉面试得很糟糕的,因为问到的很多问题都很难,根本回答不上来.不过那天晚上,还是很惊喜的接到了HR面电话.现在HR面试的结果还没有出来,听说要等到下周二才出,所以再好好等几天哈. 前面说了这多的废话,现在是时候和伙伴们分享一下面试干货哈.因为二面问到的内容还挺多的,所以这里就不全部列举出来了.这里只讨论一下函数的重载. …

浅谈线程池（上）：线程池的作用及CLR线程池

原文地址:http://blog.zhaojie.me/2009/07/thread-pool-1-the-goal-and-the-clr-thread-pool.html 线程池是一个重要的概念.不过我发现,关于这个话题的讨论似乎还缺少了点什么.作为资料的补充,以及今后文章所需要的引用,我在这里再完整而又简单地谈一下有关线程池,还有.NET中各种线程池的基础.更详细的内容就不多作展开了,有机会我们再详细讨论这方面的细节.这次,还是一个"概述"性质的,希望可以说明白这方面问题的一些概…

浅谈JavaScript中的null和undefined

浅谈JavaScript中的null和undefined null null是JavaScript中的关键字,表示一个特殊值,常用来描述"空值". 对null进行typeof类型运算,返回的是"object",因此可以将null认为是一个特殊的对象值.用null可以表示数字,字符串和对象是"无值的". undefined undefined是预定义的全局变量,它的值就是undefined,它是变量的一种取值,表示变量没有初始化. 对undefin…

浅谈JavaScript中的正则表达式（适用初学者观看）

浅谈JavaScript中的正则表达式 1.什么是正则表达式(RegExp)? 官方定义: 正则表达式是一种特殊的字符串模式,用于匹配一组字符串,就好比用模具做产品,而正则就是这个模具,定义一种规则去匹配符合规则的字符. 个人理解:其实就是用来给字符串加一个限制,用来让字符串结果达到我们想要的结果,如电子邮箱的邮箱格式,年月日格式等 2.语法及构造函数: var reg=/表达式/[附加参数]---------例:var reg1=/全局/g; 附加参数: g:代表可以进行全局匹配 i:代表不区…

浅谈Javascript事件模拟

事件是用来描述网页中某一特定有趣时刻的,众所周知事件通常是在由用户和浏览器进行交互时触发,其实不然,通过Javascript可以在任何时间触发特定的事件,并且这些事件与浏览器创建的事件是相同的.这就意味着会有适当的事件冒泡,并且浏览器会执行分配的事件处理程序.这种能力在测试web应用程序的时候,是非常有用的,在DOM 3级规范中提供了方法来模拟特定的事件,IE9 chrome FF Opera 和 Safari都支持这样的方式,在IE8及以前的办法的IE浏览器有他自己的方式来模拟事件a)Dom…

浅谈JavaScript中的事件

引言 Html页面与JavaScript之间的交互是通过事件来完成的.事件,就是文档或者浏览器窗口中发生的一些特定的交互瞬间.可以使用侦听器(处理程序)来预订事件,以便事件发生时执行相应的代码.这在传统的软件工程中称为观察者模式. 事件流事件流描述的是从页面中接收事件的顺序.但是IE团队和Netscape团队提出了完全相反的事件流概念.IE提出的是事件冒泡流,Netscape提出的是事件捕获流.下面我们就来详细介绍这方面的内容. 事件冒泡 IE的事件流是事件冒泡.即事件开始时由最具体的元素(文…

浅谈JavaScript中的内存管理

一门语言的内存存储方式是我们学习他必须要了解的,接下来让我浅谈一下自己对他的认识. 首先说,JavaScript中的变量包含两种两种类型: 1)值类型或基本类型:undefined.null.number.boolean.string,这些类型在内存中分别占有固定大小的空间,他们的值保存在栈(Stack)中,一般说他们是按值访问的. 2)引用类型:Object (1)原生引用类型,由ECMAScript标准定义:Array String Number Data Boolean等…

【javascript】浅谈javaScript的深拷贝

前言: 最开始意识到深拷贝的重要性是在我使用redux的时候(react + redux), redux的机制要求在reducer中必须返回一个新的对象,而不能对原来的对象做改动,事实上,当时我当然不会主动犯这个错误,但很多时候,一不小心可能就会修改了原来的对象,例如:var newObj = obj; newObj.xxx = xxx 实际上,这个时候newObj和obj两个引用指向的是同一个对象,我修改了newObj,实际上也就等同于修改了obj,这,就是我和深浅拷贝的第一次相遇.…

浅谈JavaScript变量声明提升

前段时间阿里实习生内推,一面就被刷了,也是郁闷.今天系统给发通知,大致意思就是内推环节不足以了解彼此,还可以参加笔试,于是赶紧再投一次.官网流程显示笔试时间3月31日,时间快到了,开始刷题.网上搜了一下去年题目,我擦,第一题就不会(伤心中...),继续往下看,第四题也不会...好嘛,搜答案吧.搜了一个多小时的博客,结合自己的理解,写下了这篇博文... 2014年阿里巴巴前端工程师笔试题目1: var v = "Hello world"; (function() { console.lo…

浅谈JavaScript的面向对象和它的封装、继承、多态

写在前面既然是浅谈,就不会从原理上深度分析,只是帮助我们更好地理解... 面向对象与面向过程面向对象和面向过程是两种不同的编程思想,刚开始接触编程的时候,我们大都是从面向过程起步的,毕竟像我一样,大家接触的第一门计算机语言大概率都是C语言,C语言就是一门典型的面向过程的计算机语言.面向过程主要是以动词为主,解决问题的方式是按照顺序一步一步调用不同的函数.面向对象是以名词为主,将问题抽象出具体的对象,而这个对象有自己的属性和方法,在解决问题的时候,是将不同的对象组合在一起使用. //面向过程装…

浅谈js的事件冒泡和事件捕获

本文地址:https://www.cnblogs.com/christineqing/p/7607113.html 前言: 这篇文章起源于上次工作上的原因,在事件上出的bug,所以就抽空写出一篇,也便于自己以后查阅,如若有幸被您阅读的话,小妹备感荣幸,文章仅为个人理解,如果内容有误的还望海涵,在您时间还方便的时候,希望能告知小妹!谢谢! 什么是事件? 事件是文档和浏览器窗口中发生的特定的交互瞬间. 事件是javascript应用跳动的心脏,也是把所有东西黏在一起的胶水,当我们与浏览器中w…

浅谈Javascript单线程和事件循环

单线程 Javascript 是单线程的,意味着不会有其他线程来竞争.为什么是单线程呢? 假设 Javascript 是多线程的,有两个线程,分别对同一个元素进行操作: function changeValue() { const e = document.getElementById("ele1"); if (e) { e.value = "VALUE"; } } function deleteElement() { const e = document.getE…

浅谈javascript的Touch事件

js的touch事件,一般用于移动端的触屏滑动代码如下: $(function(){ document.addEventListener("touchmove", _touch, false); }) function _touch(event){alert(1);} event对象 touchstart:当手指触摸屏幕时触发:即使已经有一个手指放在了屏幕上也会触发. touchmove:当手指在屏幕上滑动时连续的触发.在这个事件发生期间,调用preventDefault()可阻止滚…

[JS学习笔记]浅谈Javascript事件模型

DOM0级事件模型 element.on[type] = function(){} 兼容性:全部支持 lay1 lay2 lay3 e.target:直接触发事件的元素[IE8及以下不支持taget属性,使用e.srcElement代替] e.srcElement:直接触发事件的元素[FF不支持srcElement属性,使用e.target代替] e.currentTarget:绑定事件的元素[IE8及以下不支持currentTarget属性,使用this代替] this:同e.curren…

浅谈:javascript的面向对象编程之具体实现

下面的javascript代码都是需要使用jQuery插件来做的.希望大家可以搭建好工作环境首先我们来做一个练习:在一个删除的超链接中添加一个提示信息,提示是否确认删除. 一般情况下我们都会这么做 <html> <head> <title>delete.html</title> </head> <script type="text/javascript"> function deleteTest(){ windo…

浅谈JavaScript之原型

上一篇谈new关键字也是给这一篇写关于原型的文章买个伏笔,我对原型的理解可能会有偏差,如有错误,望指正一定修改,望各位道友如果想真正的理解原型的概念一定要再看完各方言论再回归教材. 言归正传谈原型,首先原型是一个对象,无论什么时候,只要创建了一个函数,就会按照规则创建一个Prototype属性,这个属性指向函数的原型对象,在默认情况下,所有的原型对象都会有一个constructor属性,这个属性又指向函数的原型对象.先来段代码 function Person(){} Person.prototy…

【浅谈JavaScript之事件(上)】的更多相关文章