js onclick事件

作者：开阔蓝天uだ发布日期:2025-02-06 浏览:308

<!DOCTYPE html>
<html>
<head>
    <title>JS onclick 事件示例</title>
</head>
<body>

<button id="myButton">点击我</button>
<p id="demo"></p>

<script>
// 获取按钮元素
var btn = document.getElementById("myButton");

// 添加 onclick 事件处理程序
btn.onclick = function() {
    // 当按钮被点击时，修改段落文本
    document.getElementById("demo").innerHTML = "你点击了按钮!";
};

</script>

</body>
</html>

解释说明：

HTML 部分:
- 创建了一个按钮 (<button>) 和一个段落 (<p>)。
- 按钮的 id 是 myButton，段落的 id 是 demo。
JavaScript 部分:
- 使用 document.getElementById 获取按钮元素，并将其存储在变量 btn 中。
- 使用 onclick 属性为按钮添加事件处理程序。当按钮被点击时，触发匿名函数。
- 匿名函数中，使用 document.getElementById("demo").innerHTML 修改段落的内容为 "你点击了按钮!"。

这样，当用户点击按钮时，页面上的段落内容会更新为提示信息。

上一篇：js input onchange

下一篇：js formatdate