2025年3月21日 星期五 甲辰(龙)年 月廿 设为首页 加入收藏
rss
您当前的位置:首页 > 计算机 > 编程开发 > JavaScript

JS绑定事件(静态绑定+动态绑定)

时间:03-07来源:作者:点击数:64

在基本事件模型中,JavaScript 支持以下两种绑定方式。

静态绑定

JavaScript 脚本作为属性值,直接赋予给事件属性。

示例

在下面示例中,把 JavaScript 脚本以字符串的形式传递给 onclick 属性,为 <button> 标签绑定 click 事件。当单击按钮时,就会触发 click 事件,执行这行 JavaScript 脚本。

  • <button onclick="alert('你单击了一次!');">按钮</button>

动态绑定

使用 DOM 对象的事件属性进行赋值。

示例

在下面示例中,使用 document.getElementById() 方法获取 button 元素,然后把一个匿名函数作为值传递给 button 元素的 onclick 属性,实现事件绑定操作。

  • <button id="btn">按钮</button>
  • <script>
  • var button = document.getElementById("btn");
  • button.onclick = function () {
  • alert("你点击了一次!");
  • }
  • </script>

可以在脚本中直接为页面元素附加事件,不破坏 HTML 结构,比上一种方式灵活。

方便获取更多学习、工作、生活信息请关注本站微信公众号城东书院 微信服务号城东书院 微信订阅号
推荐内容
相关内容
栏目更新
栏目热门