JavaScriptAPI

半糖奶咖

已于 2023-04-10 19:12:05 修改

阅读量88

点赞数

文章标签： javascript 前端开发语言

于 2023-03-22 19:40:12 首次发布

本文链接：https://blog.youkuaiyun.com/The_over/article/details/129717481

版权

文章介绍了JavaScript中的事件处理，包括事件源、事件类型和事件处理程序的概念，以及事件函数中`this`的指向。文中通过示例展示了行内、内部和外部三种事件绑定方式，并提供了HTML和JS代码实例，解释了如何为DOM元素添加点击事件监听器。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

事件初始

事件：触发====>响应
事件的三要素：
1、事件源：被触发的元素
2、事件类型:事件触发的方式
鼠标事件键盘事件浏览器事件
3、事件的处理程序：事件触发后要执行的代码（函数）
事件公式：事件源.事件类型 = 事件的处理程序

事件函数this指向事件源
var head = document.getElementById(‘head’) ()中要带单引号
事件的书写方式
1、行内书写法
2、内部书写法
3、外部书写法

<--!  html内容  -->
<body>
   <header id="head">我是头部，别点我</header>
   <header onclick="fn(this)">我是头部1，别点我</header>
</body>
<--! js内容  -->
<script>
   var head = document.getElementById('head')
   console.log(head);
   console.log(1);
   head.onclick = function () {
       console.log('就点你');
       console.log(2);
       console.log(this);
   }
   console.log(3);
</script>