首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

在元素上写事件和addEventListener()的区别

在元素上写事件和addEventListener()的区别 onclick添加事件不能绑定多个事件,后面绑定的会覆盖前面的。而addEventListener能添加多个事件绑定,按顺序执行。...onclick只能冒泡,addEventListener()可以得到捕获or冒泡。 addEventListener方式,不支持低版本的IE。(attachEvent 支持IE)。...addEventListener绑定后则可以用 removeEvenListener 取消。 addEventListener 是W3C DOM 规范中提供的注册事件监听器的方法。...addEventListener用法: 语法: element.addEventListener( type , listener , useCapture ) – – 添加事件监听 – – type...addEventListener兼容写法: IE9之前浏览器使用element.attachEvent(type, callback) attachEvent(type, callback) type:

1.2K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    元素可视区 client 系列

    避免了命名冲突问题 下面三种情况都会刷新页面都会触发 load 事件。...1.a标签的超链接 2.F5或者刷新按钮(强制刷新) 3.前进后退按钮 但是 火狐中,有个特点,有个“往返缓存”,这个缓存中不仅保存着页面数据,还保存了DOM和JavaScript的状态;实际上是将整个页面都保存在了内存里...此时可以使用 pageshow事件来触发。,这个事件在页面显示时触发,无论页面是否来自缓存。...在重新加载页面中,pageshow会在load事件触发后触发;根据事件对象中的persisted来判断是否是缓存中的页面触发的pageshow事件 注意这个事件给window添加。...window . addEventListener( ' pageshow', function(e) {        // e. persisted 返回的是true,从缓存取过来的页面也要重新加载

    57530

    【开源之战】在搜集人类语音数据上,谷歌与火狐展开正面交锋

    近日,火狐浏览器的所有者 Mozilla 开源了一个语音数据库,与谷歌所做的数据库高度类似。这篇文章比较了两家公司数据库的构成要素和数据搜集方法。...苹果通过聘请朗读者来阅读特定的文本,教会Siri新的语言和方言,并让人从服务器上的语音到文本转换模型上转录写语音片段。...“当我们开始开发这些系统时,我们发现我们可以在算法的基础上建立其他人的作品,并在算法方面做自己的创新工作,但是对于所有这些,数据选择,创建和聚合是一个挑战,“Mozilla新兴技术高级副总裁肖恩·怀特(...有偏见的数据在人工智能的其他领域一直是个问题,一些算法被认为更好地识别白人面孔,或者在理解推特上非裔美国人的英语时有困难,这对旨在为不同受众服务的高科技公司和开源项目来说尤其是问题。...“我们在尽可能地撒一张大网”,Henretty称。

    82130

    前端学习(51)~事件的传播和事件冒泡

    代码演示: //参数为true,代表事件在「捕获」阶段触发;参数为false或者不写参数,代表事件在「冒泡」阶段触发 box3.addEventListener("click", function...这几个元素在事件捕获阶段的完整写法是: window.addEventListener("click", function () { alert("捕获 window");...事件冒泡 事件冒泡: 当一个元素上的事件被触发的时候(比如说鼠标点击了一个按钮),同样的事件将会在那个元素的所有祖先元素中被触发。...阻止冒泡的方法 w3c的方法:(火狐、谷歌、IE11) event.stopPropagation(); IE10以下则是: event.cancelBubble = true 兼容代码如下:...// 也就是说,只要是在 box2 的区域,就只触发 document.onmousemove 事件 var box2 = document.getElementById

    98720

    【分享】在集简云上架应用如何配置一个触发动作?

    触发动作中数据的产生有两种方式:实时触发:由应用系统自动在触发事件产生时推送数据到集简云,集简云自动响应并执行。...在集简云开发者平台配置一个触发动作有如下步骤:动作信息设置: 配置动作的名称与描述等基本信息动作字段设置:触发动作非必要,如果您在触发执行前需要对数据进行筛选设置时才需要配置此字段,例如只有当满足某个条件时才执行触发...数据唯一标识”字段填写“id”更多关于接口中常用的变量,可以参考文档:编译变量&使用方式集简云在Jinja2模版语法的基础之上,提供了一些自定义的模版函数,如下: Jinja2基本语法请参考...:设置字段补充信息,比如:如果一个性别字段返回的字段值为0,我们可以填写字段值说明,例如:0-未知,1-男,2-女,集简云将在前端展现此内容,帮助用户更好的使用我们的应用:6 如何测试触发动作:我们可以在集简云创建流程测试触发动作...:点击创建流程,在集简云流程创建中搜索我们的应用名称即可开始测试。

    1.2K20

    DOM事件第二弹(UIEvent事件)

    二、baseEvent 事件名 说明 load 在内容或页面加载完成后触发。...;js对象:window,image select 文本被选中触发,js对象:window 2.1 兼容点 当load事件应用在script元素上时,在Ie不支持,需要用onreadystatechange...事件来代替(error会作为一个状态来传递); script的error,在ie上也是不支持的,也是通过onreadystatechange事件来代替(状态值)。...3.3 代码触focusin事件 我们这里需要做一个兼容方案处理,在现代浏览器下需要用focus来触发,因为我们绑定是focus事件。.... 4.2 注意 onpropertychanage事件,是属性值发生改变就会触发,如果我们一个动作导致两个属性值改变,就会触发两次: <option value

    2.9K90

    DOM事件基本概念大总结(前端必备)

    然而实际上,几乎所有主流浏览器都支持在事件捕获阶段触发事件,它们并没有遵守规定 事件处理程序 主要是指 DOM 如何处理各种 HTML 上的程序。...但是这两个方法下的 event 对象的使用有区别,特别是在 IE 浏览器上 在 window对象下触发整个页面的加载; window.addEventListener('load', function...('load', function(event) { console.log(event.target, 'js加载完毕'); }) window.addEventListener('load',...,会冒泡 focusin 在获取焦点元素上触发,会冒泡 blur 在失去元素上触发,不会冒泡 DOMFocusOut 在失去焦点元素上触发,会冒泡; Opera 专有 focus 在获取焦点元素上触发,...click 点击,只有按下事件和放开事件发生后才会触发,只是按下不会触发 dblclick 双击,当且仅当连续两次 click 时触发 触发顺序: mousedown mouseup click

    1.9K20

    JavaScript(十二)

    事件流 ---- 最早的两大浏览器厂商(IE 及 Netscape)在如何在看待浏览器事件方面还是一致的。比如说,如果你单击了某个按钮,他们都认为单击事件不仅仅发生在按钮上。...事件对象 ---- 在触发 DOM 上的某个事件时,会产生一个事件对象 event,这个对象中包含着所有与事件有关的信息。...现有的 UI 事件如下: load: 当页面完全加载后在 window 上面触发,当图像加载完毕时在 img 元素上面触发 unload: 当页面完全卸载后在 window 上面触发 error: 当发生...unload 事件 与 load 事件对应的是 unload 事件,这个事件在文档被完全卸载后触发。只要用户从一个页面切换到另一个页面,就会发生 unload 事件。...类似地,只有触发两次 click 事件,才会触发一次 dblclick 事件。如果有代码阻止了连续两次触发 click 事件,那么就不会触发 dblclick 事件了。

    2.9K20

    清除浏览器cookie 原

    火狐的在标签页背景上有一层透明度不是很好的偏白背景,扩展图标容易朦胧看不清晰,找了很多主题都无法改变这里,可能是别的地方需要设置一下?...Idge的和办公结合起来真是不错,自带笔记编辑功能很方便编辑保存,但是插件上在调试方面偏少一些,主题只找到默认的亮,暗两种,没找到商店里关于浏览器的主题插件 ? 随时做笔记,分享编辑保存很方便。...3).书签收藏栏默认可设置在左侧,对于浏览器来说,比放在上方更合适。当然,谷歌和火狐可以找到很多插件来满足使用要求。 ? 4).全中文页面,布局管理更方便 ? ? 高级设置-继续 ? ?...element.async = true; document.body.appendChild(element); } if (window.addEventListener...) { window.addEventListener("load", googleAdJSAtOnload, false); } else if (window.attachEvent

    3.5K20
    领券