跳到主要内容

XHTML 和 HTML 有什么区别？

面试速答（30 秒版 TL;DR）​

  • XHTML（Extensible HyperText Markup Language）本质是“用 XML 语法来写 HTML”：要求严格的 XML well-formed（必须正确闭合、嵌套、大小写、属性引号等）。
  • HTML（通常指 HTML5/WHATWG Living Standard）是“容错的标记语言”：浏览器用 HTML 解析器做错误恢复，写错了也尽量能渲染出来。
  • 决定差异的关键不是你写得像不像 XHTML，而是响应头 Content-Type：
    • text/html：按 HTML 解析（就算你写了 />、全小写，仍然是 HTML 解析器在兜底）。
    • application/xhtml+xml：按 XML 解析（任何不合法都可能直接报错，页面渲染失败）。
  • 新项目 Web 页面一般选 text/html + HTML5；XHTML 更常见在 需要 XML 工具链 的场景（例如某些电子书/文档管线、XSLT 处理等）。

心智模型：同一份“长得像 XHTML 的代码”，可能走两套解析器​

你在面试里要强调的点：XHTML 的“严格”是靠 XML 解析器保证的；如果以 text/html 发送，很多“严格语法”只是代码风格，并不会让浏览器变严格。

核心区别对比（高频考点）​

维度HTML（text/html）XHTML（application/xhtml+xml）你该怎么说
解析规则HTML 解析器，强错误恢复XML 解析器，必须 well-formed容错 vs 严格
标签/属性大小写不区分（规范化为小写）区分大小写（通常要求小写）XHTML 大小写错会出事
标签闭合与嵌套许多可省略闭合标签；嵌套错了也会被“修复”必须正确闭合与正确嵌套少一个 </p> 在 XHTML 可能直接挂
空元素（void elements）br/img/input 等不需要闭合；<br /> 也能用通常用 /> 自闭合（如 <br />）空元素写法不同
属性值引号多数情况下可省略（不推荐）必须加引号XHTML 必须引号
布尔属性checked disabled required 可直接写属性名通常写成 checked="checked"（或按规范约束）XHTML 不能“属性最小化”
实体（entity）内置大量命名实体（如 &nbsp;）XML 默认只有 5 个预定义实体；用命名实体容易踩坑&nbsp; 在真 XHTML 里是经典坑
MIME 与兼容性兼容最好（事实标准）需要正确的 Content-Type，历史上兼容成本更高Web 上更常见 HTML

注：上表的“XHTML 行为”指 作为 XML 解析 的 XHTML（即 application/xhtml+xml）。如果用 text/html 发 XHTML 1.0 文档，浏览器仍按 HTML 解析，很多差异不成立。

最小示例：同样的“看起来没问题”，在 XHTML 里可能直接致命​

1）不闭合/嵌套错误：HTML 能修，XHTML 直接报错​

<!-- 在 HTML 里浏览器通常会修复 -->
<p><em>hello</p></em>

在 XHTML（XML）里，这是 不合法的嵌套：必须先闭合 </em> 再闭合 </p>。

2）&nbsp;：HTML 很常见，真 XHTML 里可能直接炸​

<!-- HTML OK -->
<p>A&nbsp;B</p>

如果这是 application/xhtml+xml，&nbsp; 不是 XML 预定义实体，可能触发解析错误。更稳妥写法是用字符本身（不换行空格）或数值引用：

<p>A&#160;B</p>

3）布尔属性：HTML 可以省值，XHTML 通常不行​

<!-- HTML 常见写法 -->
<input type="checkbox" checked />

在 XHTML 里更常见（也更“保守正确”）的写法：

<input type="checkbox" checked="checked" />

典型题 & 标准答法​

Q1：一句话区别？​

答法：

  • HTML 是容错解析的标记语言；XHTML 是 XML 序列化的 HTML，必须满足 XML 的严格语法。
  • 真正决定解析规则的是 Content-Type：text/html vs application/xhtml+xml。

Q2：为什么现在 Web 很少用 XHTML？​

答法要点：

  • 以 XML 发送时严格但脆：一点小错误就可能导致整页渲染失败，线上风险更高。
  • text/html 的 HTML5 已经足够成熟，配合 lint/formatter/validator 也能做到“工程上的严格”。
  • 历史兼容性与内容协商（content negotiation）带来额外复杂度，收益不大。

Q3：那 XHTML 还有用吗？​

答法要点：

  • 有：当你确实需要 XML 工具链（例如 XSLT、某些出版/电子书格式、强约束的 XML 管线）时，XHTML 的约束与命名空间更匹配。
  • 但对普通 Web 站点，优先 HTML5（text/html）更现实。

常见追问（加分点）​

  • XHTML 1.0、XHTML 1.1、XHTML5 是什么关系？
    • XHTML 1.0/1.1 是 W3C 的规格；XHTML5 更准确的说法是 HTML5 的 XML 序列化（同一套语义，不同解析/语法约束）。
  • 我在页面里写了 <?xml ...?> 就是 XHTML 吗？
    • 不是。是否按 XML 解析主要看 Content-Type；同时把 XML 声明塞到 text/html 页面顶部，还可能在老环境触发兼容问题（例如渲染模式/缓存行为异常）。
  • XHTML 更安全吗/更快吗？
    • 一般不是。安全主要取决于输入处理、输出编码与 CSP 等；性能主要取决于页面复杂度与资源加载。XHTML 的“严格”更多是语法约束，不是安全机制。

易错点/坑（面试高频）​

  • 把“写法像 XHTML”误当成“解析是 XHTML”：<br />、全小写并不代表浏览器按 XML 解析。
  • &nbsp;、&copy; 这类命名实体：在真 XHTML（XML）里容易踩坑，优先用字符本身或 &#...;。
  • 脚本/样式内容中的特殊字符：在 XML 解析下更敏感，内联脚本可能需要 CDATA/转义；工程上更推荐外链脚本、减少内联复杂度。

速记要点（可背诵）​

  • HTML：容错解析；XHTML：XML 严格语法。
  • 关键看 Content-Type：text/html 走 HTML 解析器；application/xhtml+xml 走 XML 解析器。
  • XHTML 的优势是“可被 XML 工具链严格处理”；Web 页面通常选 HTML5。