javascript中的addEventListener()方法

2021-10-29 用户投稿学习笔记 4372阅读

我们操作HTML DOM对象的时候，可以利addEventListener()方法为某个被选中的DOM对象添加一个事件，用来操作这个被选中的对象。下面就记录一下，如果利javascript的addEventListener方法，为HTML的ODM对象添加一个事件！

addEventListener()定义与语法

addEventListener()用于向指定的元素添加事件

element.addEventListtener(event,function,useCapture);

addEventListener()举个例子：

点击按钮一个ID为button的按钮，并向一个ID为la的div层中插入内容自定义内容，飞鸟慕鱼博客

html代码：

<button id="buttom">点我</button><div id="la"></div>

javascript代码1：

document.getElementById("button").addEventListener("click" function(){    document.getElementById(la).innerHTML = "飞鸟慕鱼博客";})

javascript代码2：

document.getElementById("button").addEventListener("click" dome1);function dome1(){    document.getElementById("la").innerHTML = "飞鸟慕鱼博客";}

关于addEventListener()整体代码：

addeventlistener 参数, addeventlistener 用法

<!DOCTYPE html><html>    <head>    </head>    <body>        <button id="buttom">点我</button>        <div id="la"></div>        <script>        //第一种            document.getElementById("button").addEventListener("click" function(){                document.getElementById(la).innerHTML = "飞鸟慕鱼博客";            })        //第二种            document.getElementById("button").addEventListener("click" dome1);            function dome1(){                document.getElementById("la").innerHTML = "飞鸟慕鱼博客";            }        </script>    </body></html>

代码未作完整测试，只做一个记录备注，使用前请测试！

标签：