Laravel  
laravel
文档
数据库
架构
入门
php技术
    
Laravelphp
laravel / php / java / vue / mysql / linux / python / javascript / html / css / c++ / c#

js 点击按钮

作者:—只賣身不賣藝   发布日期:2025-10-06   浏览:81

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

// JavaScript部分
document.getElementById("myButton").addEventListener("click", function() {
    // 当按钮被点击时,执行以下代码
    document.getElementById("demo").innerHTML = "按钮已被点击!";
});

解释说明:

  1. HTML部分:

    • 创建了一个按钮元素 (<button>),并给它一个 id"myButton"
    • 还创建了一个段落元素 (<p>),用于显示点击按钮后的消息,它的 id"demo"
  2. JavaScript部分:

    • 使用 document.getElementById("myButton") 获取按钮元素,并为其添加一个点击事件监听器 (addEventListener)。
    • 当按钮被点击时,触发匿名函数中的代码。
    • 在匿名函数中,通过 document.getElementById("demo").innerHTML 修改段落元素的内容为 "按钮已被点击!"

这样,当用户点击按钮时,页面上的段落会显示一条消息,表明按钮已被点击。

上一篇:js select

下一篇:js 轮播图

大家都在看

js 数组对象排序

js 数组删掉第一个值

js fill

js 数组连接

js json数组

js 数组复制

js 复制数组

js 数组拷贝

js 对象数组合并

js 对象转数组

Laravel PHP 深圳智简公司。版权所有©2023-2043 LaravelPHP 粤ICP备2021048745号-3

Laravel 中文站