行，但需搭配js或后端实现增删改查；html仅负责语义化结构，如用、data-id、data-action等为js预留扩展点，表单须加required/type校验，状态选项应动态渲染。
用原生 HTML + CSS 做出可用的社团管理后台，不依赖框架行不行？
行，但得接受一个现实：HTML 本身不处理数据、不校验表单、不联动状态——它只负责结构和静态呈现。所谓“后台页面”，实际是「表单容器 + 表格展示 + 按钮占位」的组合。真要增删改查，必须搭配 JS（哪怕只是 localStorage）或后端接口。纯 HTML 页面刷新即丢数据，连成员列表都存不住。
成员列表表格怎么写才方便后续加 JS 逻辑？
关键在语义化结构和可扩展属性。别用 <div> 堆表格，用标准 <code><table>；每行成员加 <code>data-id，操作按钮统一用 data-action 标记类型：
| 姓名 | 学号 | 加入时间 | 操作 |
|---|---|---|---|
| 张三 | 2022001 | 2024-03-15 |
-
data-id是后续 JS 定位数据的唯一锚点，别写成id="row-1001"（易冲突，且无法批量提取） - 操作按钮不用写
onclick内联事件，留到外部 JS 统一绑定委托（document.getElementById('member-list').addEventListener('click', ...)） - 表头用
<th> 而非 <code><td>，利于屏幕阅读器和未来导出 Excel <h3>添加新成员的表单，哪些字段必须加 <code>required和type？不是所有输入框都适合加
required，但核心身份字段必须：学号（唯一性）、姓名（不可空）、加入日期（建议用type="date"）。其他如电话、邮箱可选，但加了就该配对应校验：-
pattern配合title能触发浏览器原生提示，比纯 JS 校验更轻量 -
type="date"在移动端自动唤起日期选择器，iOS/Android 均支持，别用text+ JS 插件 -
type="tel"不会自动格式化，但能避免桌面端意外弹出数字键盘，体验更稳 - 表单必须设
id，否则 JS 获取不到submit事件
活动管理模块里，“活动状态”下拉菜单怎么避免写死选项？
写死
<option></option>看似简单，但后期状态扩展（比如新增“延期中”“已归档”）就得改 HTML。更可持续的做法是用 JS 动态渲染，并把状态配置抽成数组：<select id="activity-status"></select>
const statusOptions = [{ value: 'draft', label: '草稿' }, { value: 'active', label: '进行中' }, { value: 'completed', label: '已完成' }];- JS 初始化时遍历
statusOptions插入<option></option>，维护成本低 - 值（
value）用英文小写+下划线，方便后端接收和数据库存储 - 中文
label只用于显示，不参与逻辑判断 - 如果状态有顺序要求（如“草稿→进行中→已完成”），数组顺序就是业务顺序，别靠 CSS 或 DOM 位置推断
纯 HTML 后台最易被忽略的点：没有服务端渲染，所有动态交互都得靠 JS 补足；而 JS 一旦出错或被禁用，整个页面就退化为不可用的静态文档。别高估用户环境，也别低估自己后期补逻辑的难度。
-
