JavaScript浏览器事件简介

事件是发生某事的信号。

例如,DOM中的一些内置事件是-

  • click -甲指针设备按钮(ANY按钮;即将主按钮只)已被按下并在元件上释放。

  • mouseover-指向设备移动到连接了侦听器的元素上或其子元素上。

  • keyup-释放任何密钥

  • load-资源及其从属资源已完成加载。

您可以使用以下方式创建自己的事件:

new Event('my-event');

您可以使用dispatchEvent在元素上分派这些事件-

HTML  -

<div id="my-div"></div>

JS  -

const myDiv = document.querySelector('#my-div')

myDiv.dispatchEvent(new Event('my-event'));

您可以添加事件监听器,以定义使用addEventListener接收事件时要执行的操作-

HTML  -

<div id="my-div"></div>

JS  -

const myDiv = document.querySelector('#my-div')

myDiv.addEventListener(

   // Event for which we want to listen

   'my-event',

   // Handler Function

   (e) => alert('Event fired!')

);

myDiv.dispatchEvent(new Event('my-event'));

运行上面的代码会将事件侦听器附加到我们的div上,该侦听器将侦听my-event事件。遇到此事件时,它将调用回调函数。

由于我们正在调度此事件,因此将立即将其触发,并会看到警报框。

以上是 JavaScript浏览器事件简介 的全部内容, 来源链接: utcz.com/z/331573.html

回到顶部