给对象添加监听事件和侦听函数
一个事件中,包含三个对象:监听对象,监听事件和侦听函数。意思是当监听对象发生指定事件时,会自动触发设置好的侦听函数。
以给元素添加点击事件onclick
为例:
1
|
<div onclick="console.log('click event1')">element</div>
|
案例源码
这里onclick
的属性值,被当做 js 语句执行了
第二种方式是把要执行的语句封装到函数中,把函数调用作为事件的属性值
1
2
3
4
5
6
|
<div onclick="add()">element</div>
<script>
function add() {
console.log("click event");
}
</script>
|
案例源码
第三种方式,是把监听事件和侦听函数都放在js
当中:
1
2
3
4
5
6
7
|
<div onclick="add()">element</div>
<script>
var div = document.querySelector("div");
div.onclick = function add() {
console.log("click event");
};
</script>
|
案例源码