="X-UA-Compatible" content="ie=edge"> <script type="text/javascript" src='vue.min.<em>js</em>...function(event,l) { console.log(event,l); } } }); 解释： $event是<em>事件</em><em>对象</em>...="X-UA-Compatible" content="ie=edge"> <script type="text/javascript" src='vue.min.js...一样的效果，都是事件冒泡. 效果： ? ? <!...都是阻止默认事件. 效果图： ?
2.事件的三种写法 //在HTML中把事件处理函数作为属性执行JS函数 ...一．事件对象 当触发某个事件时，会产生一个事件对象，这个对象包含着所有与事件有关的信息。...在非IE浏览器下，事件对象作为事件的参数，在IE下是window.event //实现跨浏览器兼容获取event对象 input.onclick = function (evt) {...，这就是为什 么性能优化的主要思想之一就是减少DOM操作的原因；如果要用事件委托，就 会将所有的操作放到js程序里面，与dom的操作就只需要交互一次，这样就能大 大的减少与dom的交互次数，提高性能；...每个函数都是一个对象，是对象就会占用内存，对象越多，内存占用率就越大， 自然性能就越差了，比如上面的100个li，就要占用100个内存空间，如果 是1000个，10000个呢，那只能说呵呵了，如果用事件委托
做笔记，以防自己忘记~~ JS获取事件event，不同浏览器有不同的做法。 例如IE下，在js函数中，通过window.event就可以获取，不必在函数中添加什么参数。...也可以用Prototype或者JQuery等，它们有他们对事件的包装。还是使用JS库比较好，不然就有下边的麻烦。...感觉这个挺好，可以捕获当前事件作用的对象，如event.srcElement.tagName可以捕获活动标记名称。注意获取的标记都以大写表示，如"TD","TR","A"等。...在 ie中处理事件直接使用window.event对象即可,但在firefox中,是没有 window.event对象的,函数需要使用事件的时候,需要在事件发生时把事件作为参数传递给函数,不象在ie...中,事件对象是全局的,随处都可以访 问.下面这个getEvent()函数可以兼容firefox和ie,只需要在访问事件对象的函数的开始调用getEvent()即可,不用再把事件作为 参数传递.以下代码已经实验通过
二、js事件 事件是指浏览器或用户做的某些事情。 举几个例子：鼠标单击、双击某个按钮；键盘按着（不停地在输入）；键盘弹起（输入结束）… 事件有好多个，暂且只学常用的几个。 ?...我个人的理解是： 全名函数是直接在input标签（也就是HTML中）触发的事件；而匿名函数是在js中触发的事件。...这样匿名函数就会有一个执行顺序问题： 页面是从上到下执行的，当加载到js中双击事件的时候，对应的input标签都还没有加载呢。 那如何解决这个问题？...所以就算input标签在script标签的后面，也能触发事件。emm…暂且就是这样理解的。 三、js对象 学一学js中内置的几种常用对象 1数组对象 ?...在Java中，需要自定义格式，显得特别的麻烦，但是在js中直接调用该方法就可以了。 3全局对象 什么叫全局对象呢？ 就是不用创建对象，直接可以使用该对象。
本期介绍 本期主要介绍DOM对象&JS事件总结&全局函数 文章目录 1. DOM 对象 1.1 DOM 对象是什么？有什么作用？ 1.2 DOM 树介绍 1.3 DOM 和 BOM 关系 2. ...JS 事件总结 3. 全局函数（global） 3.1 执行 3.2 编码和解码 3.3 字符串转数字 1. DOM 对象 1.1 DOM 对象是什么？有什么作用？...DOM （ Document Object Model ） 文档对象模型 文档：标记型文档（ HTML 、 XML 等） DOM 是将标记型文档中所有内容（标签、文本、属性）都封装成对象...DOM 对象。...JS 事件总结 常见事件 示例代码： 鼠标键盘事件 示例代码： 3. 全局函数（global） 3.1 执行 作用：用于增强程序的扩展性。
.]frames[n].ObjFuncVarName,frames["frameName"].ObjFuncVarName,frameName.ObjFuncVarName 44.parent代表父亲对象...,top代表最顶端对象 45.打开子窗口的父窗口为:opener 46.表示当前所属的位置:this 47.当在超链接中调用JS函数时用:(Javascript:)来开头后面加函数名 48.在老的浏览器中不执行此...HTML: 51.当超链和ONCLICK事件都有时,则老版本的浏览器转向a.html,否则转向b.html.例:dfsadf 52.JS的内建对象有:Array,Boolean,Date,Error,EvalError,Function...（用于框架） 89-2.opener.location.reload()刷新父窗口对象（用于单开窗口） 89-3.top.location.reload()刷新最顶端对象（用于多开窗口） 90.window.history.back
1 事件 一 .鼠标事件 1.ready（）页面载入事件：载入文档节点 2 click（）熟悉的单击事件 3 dbclick（）双击事件 4 mousedown() /mouseup...有两个参数（方法），鼠标一定到指定对象以及移出时会触发 二 键盘事件 1 keydown 键盘按下时触发的事件 2 keyup 键盘松开一瞬间触发的事件 3 keypress...display','block') } //滚动条的距离scrollTop()和scrollLeft() }) 2 事件对象... JQ在事件函数中默认传递了参数event对象， 一 event对象属性 1 event .type 描述事件的类型 2 event.target 触发该事件的... //clientX/clientY 获取相当于页面视口的坐标 //除去上下窗口 不会随着滚动条变化而变化 <script src="jquery-3.1.1.min.<em>js</em>
js之动画事件 首先，动画事件主要包括以下三个animationstart，animationiteration和animationend事件，下面做简单分别介绍。...animationstart 该事件在css动画开始播放时触发 animationiteration 该事件在css动画重新播放时触发 animationend 该事件在css动画结束播放时触发 我们知道...animation:name duration timing-function delay iteration-count direction; 分别是：动画名称 动画持续事件 动画运行速度曲线 动画开始时的运行时间...this.innerHTML="动画正在运行"; x.style.background="pink"; } function myanimationiterration() //动画再次运行触发，同样也是通过事件监听...this.innerHTML="动画重新运行"; x.style.background="greenyellow"; } function myanimationend() //动画运行结束时触发，同样也是通过事件监听事件
event: 事件对象，当一个事件发生的时候，和当前这个对象发生的这个事件有关的一些详细信息都会被临时保存到一个指定的地方-event对象，供我们在需要的时候调用。...事件对象必须在一个事件调用的函数里面使用才有内容 事件函数：事件调用的函数，一个函数是不是事件函数，不在定义的时候决定，而是取决于谁调用这个函数。...注意兼容：ie/chrome ：event是一个内置的全局变量 标准下的浏览器:事件对象是通过事件函数的第一个参数传入的。...（非标准浏览器ie 6 、7不支持，非标准支持event）； 如果一个函数是被事件调用的，那么，这个函数定义的第一个参数就是事件对象。...，事件函数，是否捕获) 1.有捕获 2.事件名称中没有on 3.事件执行是正序 4.this指向该触发事件的对象 //第三个参数:是否捕获（默认是false） false：冒泡 true：是捕获
1.对象转数组 var obj = {name:”张三”,name:”李四”,name:”王五”}; var arr = []; arr = Object.values(obj) //obj就被转换成数组了...2.数组转对象 var obj={}; var arr = []; for(key in arr) { obj[key] = arr[key] //上面的对象obj会被这里新转换的替换 } 3.获取对象长度...对象的长度不能用.length获取，用js原生的Object.keys可以获取到 var obj = {‘ww’:’11’,’ee’:’22}; var arr = Object.keys
一．事件对象 事件处理三部分组成：对象.事件处理函数=函数。例如：单击文档任意处。...onclick表示一个事件处理函数或绑定对象的属性(或者叫事件监听器、侦听器)。document表示一个绑定的对象，用于触发某个元素区域。function()匿名函数是被执行的函数，用于触发后执行。...}; 从上面的拆分，我们并没有发现本章的重点：事件对象。...那么事件对象是什么？它在哪里呢？当触发某个事件时，会产生一个事件对象，这个对象包含着所有与事件有关的信息。包括导致事件的元素、事件的类型、以及其它与特定事件相关的信息。...事件对象，我们一般称作为event对象，这个对象是浏览器通过函数把这个对象作为参数传递过来的。那么首先，我们就必须验证一下，在执行函数中没有传递参数，是否可以得到隐藏的参数。
一、概述 事件委托，又叫事件代理。事件委托就是利用事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。 例子：有三个同事预计会在周一收到快递。...，这就是为什么性能优化的主要思想之一就是减少DOM操作的原因；如果要用事件委托，就会将所有的操作放到js程序里面，与dom的操作就只需要交互一次，这样就能大大的减少与dom的交互次数，提高性能； 每个函数都是一个对象...，是对象就会占用内存，对象越多，内存占用率就越大，自然性能就越差了（内存不够用，是硬伤，哈哈），比如上面的100个li，就要占用100个内存空间，如果是1000个，10000个呢，那只能说呵呵了，如果用事件委托...，那么我们就可以只对它的父级（如果只有一个父级）这一个对象进行操作，这样我们就需要一个内存空间就够了，是不是省了很多，自然性能就会更好。...三、事件委托原理 事件委托利用的是事件冒泡原理，将事件绑定到父级元素上，当点击子元素时，通过事件冒泡将事件传递到父级元素。 四、总结： 那什么样的事件可以用事件委托，什么样的事件不可以用呢？
先上结论： 他们是描述事件触发时序问题的术语。事件捕获指的是从document到触发事件的那个节点，即自上而下的去触发事件。相反的，事件冒泡是自下而上的去触发事件。...绑定事件方法的第三个参数，就是控制事件触发顺序是否为事件捕获。true,事件捕获；false,事件冒泡。默认false,即事件冒泡。...，"+this.id) }) 结果： child事件被触发，child parent事件被触发，parent 结论：先child，然后parent。...事件的触发顺序自内向外，这就是事件冒泡。...事件触发顺序变更为自外向内，这就是事件捕获。 方法： 阻止事件冒泡 和默认行为。 事件冒泡： ? 阻止默认行为： ?
jQuery事件对象其实就是js事件对象的一个封装，处理了兼容性。...false:既能阻止事件冒泡，又能阻止浏览器默认行为。...jquery.color.js animate不支持颜色的渐变，但是使用了jquery.color.js后，就可以支持颜色的渐变了。 使用插件的步骤 //1....使用插件 jquery.lazyload.js 懒加载插件 jquery.ui.js插件 jQueryUI专指由jQuery官方维护的UI方向的插件。...使用jQueryUI功能 使用jquery.ui.js手风琴菜单 制作jquery插件 原理：jquery插件其实说白了就是给jquery对象增加一个新的方法，让jquery对象拥有某一个功能。
theme: channing-cyan 这是我参与8月更文挑战的第27天，活动详情查看：8月更文挑战 什么是事件对象 事件对象其实就是event对象，在我们操作DOM发生事件时，所有的相关信息都会被集中存储在这个...event对象中，这个对象中包含了被发生事件的元素，发生事件的类型以及可能与特点事件相关的其他数据，所有浏览器都支持这个event对象，但是ie的访问方式略有不同，我们稍后细说，往下观看。...DOM事件对象 event对象是传给事件处理程序的唯一参数，我们输出一下它看看里面都有什么。...我们说一下this指向问题 在事件处理程序内部，this对象始终等于currentTarget的值。...IE事件对象 前面提到过ie的访问方式不同，在ie中event对象可能是window对象中的一个属性。
在触发DOM上的某个事件时，会产生一个事件对象event，这个对象中包含这所有与事件有关的信息。包括导致事件的元素、事件的类型和事件的相关信息。例如鼠标操作的事件中，会包含鼠标的位置信息。...而键盘触发的事件会包含与按下的键有关信息。所有浏览器都支持event对象，但支持方式不同。 DOM中的事件对象 兼容dom的浏览会将一个event对象传递到事件处理程序中。...document.body.onclick发生在事件的冒泡阶段。 IE中的事件对象 在IE中方式event对象可以通过多种方式，取决于指定事件处理程序的方法。... 虽然DOM与IE的event对象不同，但是可以通过js库，来解决浏览器的兼容性。...，包括添加事件、移除事件、获取事件对象、获取事件的目标元素、阻止默认行为和阻止冒泡。
DOM事件流（event flow ）存在三个阶段：事件捕获阶段、处于目标阶段、事件冒泡阶段。...事件捕获*（****event capturing****）*：通俗的理解就是，当鼠标点击或者触发dom事件时，浏览器会从根节点开始由外到内进行事件传播，即点击了子元素，如果父元素通过事件捕获方式注册了对应的事件的话...事件冒泡**（***dubbed bubbling***）**：与事件捕获恰恰相反，事件冒泡顺序是由内到外进行事件传播，直到根节点。...dom标准事件流的触发的先后顺序为：先捕获再冒泡，即当触发dom事件时，会先进行事件捕获，捕获到事件源之后通过事件传播进行事件冒泡。...on 的事件。
首先，我们来解释下事件循环是个什么东西: 就我们所知，浏览器的js是单线程的，也就是说，在同一时刻，最多也只有一个代码段在执行，可是浏览器又能很好的处理异步请求，那么到底是为什么呢？...我们先来看一张图(这张图来自于http://www.zcfy.cc/article/node-js-at-scale-understanding-the-node-js-event-loop-risingstack...从上图我们可以看出，js主线程它是有一个执行栈的，所有的js代码都会在执行栈里运行。...原因：因为一开始js主线程中跑的任务就是macrotask任务，而根据事件循环的流程，一次事件循环只会执行一个macrotask任务，因此，执行完主线程的代码后，它就去从microtask队列里取队首任务来执行...， 以及借鉴了其他优秀文章 参考: http://www.zcfy.cc/article/node-js-at-scale-understanding-the-node-js-event-loop-risingstack
oDrag.style.left=l+'px'; oDrag.style.top =t+'px'; } 知识点： 用class获取元素封装; 学习mouseover事件
用户在浏览器的任何一个操作都会去触发一个事件，JavaScript采用异步事件驱动编程模型，当文档、浏览器、元素或与之相关对象发生特定事情时，浏览器会产生事件。...如果事件不传播，我们无法确定我们点击的对象是什么？ 2、事件流三种模型 2.1事件冒泡模型 事件开始时由最具体的元素接收，然后逐级向上传播到较为不具体的元素。...DOCTYPE html> JS Bin .box1{ border:...1、事件对象的来源 在触发DOM上的某个事件的时候会产生一个事件对象event，这个对象包含着所有与事件有关的信息，包括产生事件的元素、事件类型等相关信息。...2、举个栗子 需求：给container里面所有box都绑定点击事件，点击时输出box的值 2.1方式一：foreach 原理：选中.box所有元素，得到一个类数组对象，遍历这个类数组对象，给.box元素一一绑
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频
