Java教程

【金秋打卡】第16天 从函数到函数式编程之路

本文主要是介绍【金秋打卡】第16天 从函数到函数式编程之路，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

课程名称：破解JavaScript高级玩法
课程章节：第7章 如果不用vue，react框架，如何操作DOM？
主讲老师：Cloud

课程内容：

今天学习的内容包括：
7-7 自定义事件，满足个性化需求，增加代码灵活度——触发自定义事件的三种方法，解决特定事件。

课程收获：

内置的事件类型
  • 比如点击保存按钮， 这是就是点击事件 (click)
  • 某个文本失去焦点后检查输入的内容是否合法，这是 blur事件
  • 鼠标滚动页，页面滚动的，这是 mousewheel事件
触发内置事件
  • elment.evenType
  • new [Event] + dispatchEvent
自定义事件 - 三种方式
  • 如何触发下自定义（非内置）的事件呢？
  1. document.createEvent：已废弃
  2. new Event()
  3. new CustomEvent()
自定义事件-document.createEvent
var event = document.createEvent(type)
名称 数据类型 参数说明 可选? 默认值
type String 要创建的事件类型。事件类型可能包括"UIEvents",“MouseEvents”,“MutationEvents”,或者"HTMLEvents" 必填 无
自定义事件-new Event
event = new Event(type,eventInit)
名称 数据类型 参数说明 可选? 默认值
type String 事件类型 必填 无
eventlnit.bubbles Boolean 是否冒泡 可选 false
eventInit.cancelable Boolean 能否被取消 可选 false
eventlnit.composed Boolean 是否会在影子DOM根节点之外触发侦听器 可选 false
自定义事件-new CustomEvent
event = new Event(type,eventInit)
名称 数据类型 参数说明 可选? 默认值
type String 事件类型 必填 无
eventlnit.detail any 事件参数 可选 null
eventlnit.bubbles Boolean 是否冒泡 可选 false
eventInit.cancelable Boolean 能否被取消 可选 false
new Event 与new CustomEvent 区别
  • 从继承关系来看，CustomEvent 是 Event的扩展
  • 参数支持，Event适合简单的自定义事件，CustomEvent支持传递数据的自定义事件

今天 学习了 自定义事件，满足个性化需求，增加代码灵活度，触发自定义事件的方法类似vue中的emits，又增加很多知识。对自己说一句，加油😀~

坚持打卡，坚持学习！明天见💪~
​
​https://img2.sycdn.imooc.com/6369c1b30001c88218980880.jpg

https://img1.sycdn.imooc.com/6369c44a0001edeb18980893.jpg

https://img1.sycdn.imooc.com/6369c460000146d418930888.jpg

​

这篇关于【金秋打卡】第16天 从函数到函数式编程之路的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
您可能喜欢
栏目导航