HTML与XHTML存在哪些区别_html和xhtml差异对比详解【教程】
XHTML 是用 XML 规则约束 HTML 的变体，非升级版；要求标签小写、属性值加引号、空元素自闭合、且必须声明 application/xhtml+xml MIME 类型，否则解析失败或退化为 HTML。
XHTML 并不是 HTML 的升级版本，而是依照 XML 规则重新约束 HTML 的变体。除非项目需要连接特定旧系统或采用严格 XML 流程，现代开发几乎无需主动选用 XHTML。
为什么浏览器面对 <img> 不会报错，XHTML 验证器却会拒绝 <img src="a.jpg">
XHTML 要求所有元素必须显式闭合，空元素（如 <img>、<br>、<hr>）也得写成自闭合形式。HTML5 中 <img src="a.jpg"> 合法，但 XHTML 必须写成 <img src="a.jpg" />（注意斜杠前的空格可选，但 /> 不可省略）。漏掉 / 会导致解析失败，浏览器可能直接停止渲染或显示 XML 解析错误。
- 常见问题是把 HTML 片段复制到 XHTML 环境后，忘了补上
/ - 需要注意：
<input type="text">同样必须写为<input type="text" /> - W3C Markup Validation Service 等验证工具会明确给出 “element is not closed” 提示
class="nav" 为何 HTML 中可以省略引号，XHTML 中却必须写出 class="nav"
XHTML 继承 XML 规则，所有属性值必须用双引号（"）或单引号（'）包裹，不能裸写。HTML5 允许 class=nav 或 class='nav'，但 XHTML 中只有 class="nav" 或 class='nav' 有效。不加引号会被解析为 malformed markup，XML 解析器直接报错。
- 典型失败场景是把 jQuery 动态拼接的 HTML 字符串迁移至 XHTML 环境，
'<div class='+cls+'>'这种写法到了 XHTML 中必然失败 - 同时受到影响的还有：
id、src、href等全部属性，同样必须遵循此约束 - 如果属性值含有空格、等号或尖括号等特殊字符，却未添加引号，解析会被直接中断
为什么将 <SCRIPT> 修改为 <script> 后依然遭到 XHTML 拒绝
XHTML 会区分大小写，标签名与属性名一律必须小写。即使仅有一个位置使用大写（例如 <DIV>、<Img>、<ONCLICK>），文档整体也不再属于 well-formed XML。HTML 完全不区分大小写，<SCRIPT> 与 <script> 在其中等价；但在 XHTML 中，前者属于非法标签名，解析器会把它当成未知元素，甚至停止 DOM 构建。
立即学习“前端免费学习笔记（深入）”；
- 还有一个容易漏掉的细节：内联事件处理器如
onClick必须改写成onclick - 自定义属性（例如
data-MyAttr）也必须全部小写：data-myattr - 编辑器的自动补全有时会沿用大写形式，因此需要手动核查
application/xhtml+xml 设置MIME类型后页面直接白屏
这是最隐蔽的坑：XHTML 文档必须通过 HTTP 响应头声明 Content-Type: application/xhtml+xml，仅靠 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" ...> 不够。如果服务器返回的是 text/html（绝大多数默认配置），浏览器就当普通 HTML 解析，前述所有 XHTML 语法规则都会被忽略——等于白写了。而一旦真设成 application/xhtml+xml，任何语法错误（哪怕多一个空格、少一个引号）都会让浏览器直接报 XML 解析错误，页面空白。
- 其后果较严重：前端调试阶段可能看不出异常，部署后如果 MIME 类型没有匹配，XHTML 语义将完全失效
- 从兼容性看，IE8 以及更早的版本完全不支持
application/xhtml+xml - 现代项目可改用 HTML5 +
<!DOCTYPE html>，再结合 ESLint / HTMLHint 等工具检查语法，比强行采用 XHTML 更容易控制
实际必须使用 XHTML 的情况非常少。多数所谓“标准要求”，通过 HTML5 语义化和严格校验即可满足；强套 XHTML 只会在大小写、闭合、引号、MIME 类型四处反复出错，收益却很低。
