js为元素添加监听事件

element.addEventListener(event, function, useCapture)

第一个参数是事件的类型（比如 "click" 或 "mousedown"）。

第二个参数是当事件发生时我们需要调用的函数。

第三个参数是布尔值，指定使用事件冒泡还是事件捕获。此参数是可选的。

注意：请勿对事件使用 "on" 前缀；请使用 "click" 代替 "onclick"。

addEventListener可以对一个dom添加多个监听器，并且会顺序执行。

开发中，会遇到多个js文件都使用window.onload，然而只有最后一个绑定的生效，如下：

window.onload = func1()

window.onload = func2()

这时可以用addEventListener来解决：

window.addEventListener('load', func1)

window.addEventListener('load', func2)

1.把要监听的name值看作方法名，来进行监听。

2.把要监听的name值看作对象，利用hanler方法来进行监听。

3.高级用法

3.1比如，当父组件向子组件动态传值时，子组件props首次获取到父组件传来的默认值时，也需要执行函数，此时就需要将immediate属性设置为true，结合handler方法使用。

3.2当设置immediate属性为true时，无论值是否发生改变，时刻都会监听；

3.3当设置immediate属性为false时，常规用法，只有值发生改变才会监听。

4.监听模式的另一个表达方式是观察者模式，其实并没有什么高级的。购物车这个功能用监听模式可以描述为：当修改什么的时候，什么发生变化即可。

给dom元素添加事件监听一般有两种方式:

<input type="button" onclick="clickme()" id="clickme" value="点击我">

<script>

    function clickme(){

        alert("我被点击了")

    }

</script>

二、为指定对象添加事件处理

<input type="button" onclick="clickme()" id="clickme" value="点击我">

 <script>

     document.getElementById("clickme").onclick=function(){

         alert("hello world")

     }

 </script>