HTML不是交互逻辑实现者，仅提供结构基础；按钮无响应因自身不绑定事件，需JS通过addEventListener等驱动；表单提交由method、action等属性控制，非HTML自动执行；语义化标签提升可访问性与JS操作稳定性。
HTML 不是网页交互逻辑的实现者，它只是交互发生的结构基础——所有点击、输入、提交行为，都依赖 JavaScript 驱动，HTML 本身不执行任何逻辑。
为什么 <button> 点击没反应？
因为 <button> 只声明“这里有个按钮”，不自带监听器、不绑定回调、不触发事件。浏览器渲染后它只是一个静态 DOM 节点。
- 常见错误：写了
<button onclick="alert(1)">提交</button>就以为“能交互”，其实这是靠内联 JavaScript 在工作，不是 HTML 的能力 - 正确做法：用 HTML 定义结构
<button id="submitBtn">提交</button>，再用 JS 绑定行为：document.getElementById("submitBtn").addEventListener("click", () => { /* 处理逻辑 */ }); - 内联 JS（如
onclick）难调试、难复用、无法批量管理，应避免在生产代码中使用
<form> 提交到底发生了什么？
<form> 本身不发送数据，它只是告诉浏览器：“这组控件可以一起提交”。是否提交、提交到哪、怎么提交，全由属性控制。
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
-
method决定 HTTP 方法："get"把数据拼在 URL 后，"post"放在请求体里；敏感信息绝不能用get -
action指定目标地址；留空则提交给当前页面 URL，容易导致整页刷新、输入丢失 -
enctype关键于文件上传：非"multipart/form-data"时，<input type="file">选中的文件根本不会被发送 - 没写
action又没调用event.preventDefault()→ 表单走默认提交流程，页面刷新，JS 状态清空
语义化标签（如 <nav>、<main>）对交互有影响吗？
它们不改变视觉表现，也不自带交互功能，但直接影响 JS 操作的稳定性与可访问性。
立即学习“前端免费学习笔记（深入）”；
- 屏幕阅读器靠
<nav>快速跳转导航区，<main>帮助聚焦核心内容——这对键盘用户和无障碍测试至关重要 - JS 查询更可靠：
document.querySelector("main")比document.querySelector(".content-wrapper")更不易因类名变更而失效 - CSS 选择器未来可能基于语义标签增强，比如
main:has(:focus-visible)这类原生焦点感知写法已在部分浏览器支持 - 别为了“语义”而嵌套过度：
<section>不是<div>的替代品，只有存在独立主题或可被大纲算法识别的内容才该用
真正容易被忽略的，是 HTML 结构对 JS 行为的隐性约束：比如没给 <input> 加 name 属性，它就根本不会出现在表单提交数据中；又比如用 <div onclick> 代替 <button>，会丢失原生键盘焦点、空格/回车触发等可访问性支持。结构错了，后续所有交互逻辑都会打折扣。
