Objective: # 概念阐释 当用户做了一些动作后,动作触发了某些事件,浏览器响应事件,完成一次用户与浏览器的[[JavaScript 交互式网站|交互]]。 > 当一个事件被触发时(例如点击按钮、按下键盘键等),浏览器会自动创建一个事件对象并将其传递给事件处理程序(handler)。这个事件对象包含了与事件相关的各种信息,如触发事件的元素、事件类型、鼠标位置等。 - JavaScript 事件对象属性:DOM - Event - 实例属性 ## 触发事件的过程 1. 通过[[DOM文档对象模型]]查询访问响应事件的元素 2. “绑定DOM”节点声明[[js Events 事件 触发事件的类型]]:`click` `mouseover`等 1. HTML事件处理程序属性(不要用):在HTML中田间`onevent`*某条笔记的MDN实例是这样写的* 2. [[js Events Event Handler 事件处理程序]] 3. 使用事件监听器[[js Events 事件监听添加 addEventListener]] 3. 指的事件发生时需要运行的代码,触发一个函数 # 实例 当你刷新你的电子邮件收件箱、双击一个帖子或者滚动一个新闻源时,在你的浏览器中会发生一些很酷的事情。这些动作被称为事件! 在网页上的事件是用户交互和浏览器操作,你可以编程来触发功能。一些其他的事件例子包括: - 鼠标点击按钮 - 点击链接 - 光标移动到某元素上 - 向表单中添加信息 - 网页文件在浏览器中加载 - 用户在图像上向右滑动 当用户执行以上任何操作时,他们会引发或触发事件。就像“当按钮被点击时,点击事件被触发”。能够响应这些事件使你的网站具有交互性,因此更加动态。 # 相关内容 交互式网站与响应式网站的概念区别 # 参考资料 - [事件参考 - MDN](https://developer.mozilla.org/zh-CN/docs/Web/Events) - [Web API接口参考-EventTarget - MDN](https://developer.mozilla.org/zh-CN/docs/Web/API/EventTarget) - [事件对象参考](https://developer.mozilla.org/zh-CN/docs/Web/API/Event)