首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

HTML事件属性--DOM

研究html的对象,事件和方法,从js的角度来思考,这个标签的属性是通过什么方法,触发什么事件来实现的 键盘鼠标事件 页面窗口事件 表单事件 一、window事件属性 针对window对象触发的事件...} 打印前和打印后的事件方法类似,一个是在打印前触发事件,一个是在打印这个事件结束之后触发onafterprint这个事件 demo查看 2.onbeforeunload/unload...} 13.onpopstate 当浏览器窗口记录改变时运行的脚本, 14.onredo 当文档执行撤销时触发的事件 二、form事件属性 由html表单内触发的事件,通常使用在form元素中 1.onblur...利用鼠标触发的事件 1.onclick 鼠标点击元素触发的事件 点击我 function myfun() {.../鼠标释放时触发的事件 一个是按下去的瞬间就触发 一个是当鼠标被松开的时候触发 onmouseup效果和onclick一样,因为click也是点击过后触发 这两个事件加起来相当于一个click事件,但是并不能用这两个事件来做点击事件的效果

3.8K20

JavaScript——DOM事件高级

传统注册方式 利用on开头的事件onclick btn.onclick=function(){} 特点:注册事件的唯一性...事件发生时会在元素节点之间按照特定的顺序传播,这个传播过程即DOM事件流。...DOM事件流分为3个阶段: 捕获阶段 当前目标阶段 冒泡阶段 比如我们给一个div注册了点击事件事件冒泡:IE最早提出,事件开始时由最具体的元素接收,然后逐级向上传播到DOM最顶层节点的过程。...阻止事件冒泡 事件冒泡:开始时由最具体的元素接收,然后逐级向上传播到DOM最顶层节点。...事件委托也称为事件代理,在jQuery里面称为事件委派。 原理:不是每个子节点单独设置事件监听器,而是事件监听器设置在父节点上,然后利用冒泡原理影响设置每个子节点。

1.8K10

JavaScript 学习-30.HTML DOM0级事件DOM2级事件

# 前言 DOM0 级事件就是 html 元素添加onclick 属性,或者给元素添加onclick事件,但是同元素的同一事件只能绑定一个函数,否则后面的事件会覆盖前面的事件。...如果我们想一个元素绑定多次同一个时间,比如我想绑定2个onclick事件,2个都要生效,于是就有了DOM2 级事件,通过addEventListener绑定的事件。...为什么没有 DOM1 级事件,我也很好奇,DOM1 一般只有设计规范没有具体实现,所以一般没有所谓的DOM1 级事件。...DOM0 级事件 DOM0 级事件就是前面讲到的事件绑定有2种方式,在HTML 中 或在 Script 中绑定事件 在页面元素中onclick="" scrip 中给元素添加onclick属性 绑定事件...DOM2 级事件 如果我们想 2 个事件都生效,用到 DOM2 级事件,通过 addEventListener 绑定的事件

1K10

JavaScript HTML DOM EventListener

addEventListener() 方法添加的事件句柄不会覆盖已存在的事件句柄。 你可以向一个元素添加多个事件句柄。 你可以向同个元素添加多个同类型的事件句柄,如:两个 "click" 事件。...你可以向任何 DOM 对象添加事件监听,不仅仅是 HTML 元素。如: window 对象。 addEventListener() 方法可以更简单的控制事件(冒泡与捕获)。...当你使用 addEventListener() 方法时, JavaScriptHTML 标记中分离开来,可读性更强, 在没有控制HTML标记时也可以添加事件监听。...例如,使用 "click" ,而不是使用 "onclick"。 ---- 向原元素添加事件句柄 实例 当用户点击元素时弹出 "Hello World!"...在 捕获 中,外部元素的事件会先被触发,然后才会触发内部元素的事件,即: 元素的点击事件先触发 ,然后再触发 元素的点击事件

63920

HTMLDOM 对象事件

前置说明 HTML DOM 事件允许JavascriptHTML文档元素中注册不同事件处理程序。 事件通常与函数结合使用,函数不会在事件发生前被执行! (如用户点击按钮)。...在 W3C 2 级 DOM 事件中规范了事件模型HTML DOM 事件 指明使用的 DOM 属性级别。 鼠标事件 属性 描述 DOM onclick 当用户点击某个对象时调用的事件句柄。...onshow 该事件当 menu 元素在上下文菜单显示时触发 onstorage 该事件在 Web Storage(HTML 5 Web 存储)更新时触发 ontoggle 该事件在用户打开或关闭...2 cancelable 返回布尔值,指示事件是否可拥可取消的默认动作。 2 currentTarget 返回其事件监听器触发该事件的元素。 2 eventPhase 返回事件传播的当前阶段。...2 目标事件对象 方法 方法 描述 DOM addEventListener() 允许在目标事件中注册监听事件(IE8 = attachEvent()) 2 dispatchEvent() 允许发送事件监听器

1.4K20

JavaScript 教程「10」:DOM 事件

事件 什么是事件 在之前 DOM 的学习中,我们主要学习了如何获取 DOM 元素,并且学会了如何给获取的元素进行属性修改等操作。但这些基本都是静态的修改,并没有接触到一些动作。...DOM 元素被事件所触发。...DOCTYPE html> <meta name="viewport" content="width=device-width...<em>事件</em>类型 学习了<em>事件</em>的定义以及如何实现一个最简单的<em>事件</em>监听,接下来就来看看,Web API 中为 <em>DOM</em> 提供的常用<em>事件</em>类型有哪些。...键盘按下触发 keyup 键盘抬起触发 文本<em>事件</em> <em>事件</em> 说明 input 用户输入<em>事件</em> 高阶函数 高阶函数,简单的说可以被理解为函数的高级应用,<em>JavaScript</em> 中函数能够当成值来对待,然后基于这个值来实现函数的高级应用

35921

JavaScriptDom事件,案例

个人主页:楠慧 简介:一个大二的科班出身的,主要研究Java后端开发 ⏰座右铭:成功之前我们要做应该做的事情,成功之后才能做我们喜欢的事 3、JavaScript DOM 3.1、DOM介绍 DOM... 方式二 通过 DOM 元素属性绑定。...document.getElementById("btn").onclick = 执行的功能 4.3、事件小结 事件指的就是当某些组件执行了某些操作后,会触发某些代码的执行。...常用的事件 onload onsubmit onclick ondblclick onblur onfocus onchange 绑定事件方式 方式一:通过标签中的事件属性进行绑定。...方式二:通过 DOM 元素属性绑定。 5、JavaScript综合案例 5.1、案例效果介绍 在“姓名、年龄、性别”三个文本框中填写信息后,添加到“学生信息表”列表(表格)中。

1.2K20
领券