改一个别人写的报名表单，提交按钮点了没反应，查了半天发现input上写的是disabled而不是readonly，整个字段压根不会提交。属性这东西，名字差一个字母行为就完全不同，分类记比死背更有用。

全局属性：几乎所有标签都能用

id必须唯一，class可以重复，style写行内样式，title是鼠标悬停提示，lang声明语言，dir控制文字方向，hidden直接隐藏元素，tabindex决定Tab键的遍历顺序，accesskey绑定快捷键。data-开头的自定义属性最实用，data-id、data-type随便起名，JS里用dataset.id读，比把数据塞进class干净得多，也不会和样式类名打架。

表单控件的关键属性

  • type：决定控件形态，text、password、number、email、date、checkbox、radio、file、submit。
  • name：提交时的字段名，漏写这个属性字段就不会被提交，新手最常见的坑。
  • required：浏览器原生校验，空值直接拦住，连JS都不用写。
  • pattern：正则校验，比如限定六位数字，写错了浏览器不报错只是不生效。
  • readonly与disabled：前者只读但会提交，后者禁用且不提交，还要看后端要不要这个值。
  • maxlength：限制输入长度，只对文本类控件有效，number上要用min和max。

链接和图片

a标签的href是目标地址，target设为_blank会在新窗口打开，此时必须加rel等于noopener，否则新页面能通过window.opener操控原页面，这是实打实的安全问题。download属性让浏览器直接下载而不是打开。img的alt在图片加载失败时显示，也是无障碍阅读的基础，别留空。loading设为lazy开启懒加载，首屏能省不少流量。width和height最好都写上，留出占位，避免图片加载完页面跳动。

布尔属性和废弃属性

checked、selected、disabled、required都是布尔属性，写上就生效。写checked等于false依然是选中状态，要取消只能整个属性删掉，用JS操作时要用removeAttribute。align、bgcolor、border、cellpadding、valign这些在HTML5里已经废弃，虽然浏览器还兼容，但别再往新代码里写，样式交给CSS。拿不准某个属性还支不支持，去MDN查一眼，比翻五年前的旧教程快。