最简写法是内联 onclick="console.log('按钮被点了')"，适合调试；正式项目应使用 addEventListener 分离结构与行为，注意 DOM 加载时机和避免重复绑定。

点击按钮触发 console.log 的最简写法

直接在按钮上用 onclick 内联事件是最快验证的方式，适合调试或临时需求：

<button onclick="console.log('按钮被点了')">点我</button>

注意：引号要匹配，外层用双引号，内部字符串用单引号（反之亦可），否则 HTML 解析会出错。这种写法不推荐用于正式项目，但对快速确认交互是否生效非常高效。

用 addEventListener 绑定更可控的点击行为

这是现代标准做法，把 HTML 结构和 JS 行为分离，方便维护和复用：

htmlppt.skill

把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。

下载

<button id="logBtn">输出信息</button>

document.getElementById('logBtn').addEventListener('click', () => {<br>  console.log('这是来自 addEventListener 的输出');<br>});

立即学习“前端免费学习笔记（深入）”；

常见错误现象：Uncaught TypeError: Cannot read property 'addEventListener' of null——说明 JS 执行时 DOM 还没加载完。解决办法是把脚本放在