替代execcommand('bold'),语义化加粗且无障碍友好;替代斜体,强调语义;慎用,装饰性下划线应改用css;/表插入删除,带语义与时间属性;/专用于上下标,不可被+css替代。

document.execCommand 已弃用,但 HTML 原生标签格式化完全可用、稳定、无兼容性风险。直接用语义化标签,比调 execCommand 更可靠、更易维护。
哪些标签能替代 execCommand('bold') 这类操作
不用 JavaScript 操作 DOM,纯 HTML 就能实现加粗、斜体、下划线等效果,关键是选对语义标签:
-
<strong></strong>:表示内容重要,浏览器默认加粗;比<b></b>更推荐,尤其对可访问性(如屏幕阅读器)友好 -
<em></em>:表示强调,浏览器默认斜体;比<i></i>语义更清晰 -
<u></u>:带下划线,但注意它在 HTML5 中已恢复语义(表示非文本标注,如拼写错误),慎用于装饰性下划线;若仅需样式,用 CSStext-decoration: underline更可控 -
<ins></ins>和<del></del>:分别表示插入和删除,浏览器默认带下划线/删除线,且自带语义和时间属性(可配datetime) -
<sub></sub>/<sup></sup>:专用于下标、上标,数学或化学式必备,<span></span>+ CSS 无法替代其语义和排版精度
formatBlock 的等效 HTML 写法
execCommand 的 'formatBlock' 命令(如转成 <h2></h2>)本质是改变块级容器结构。HTML 中直接写对应标签即可:
- 标题层级:
<h1></h1>到<h6></h6>,必须成对闭合,不能嵌套其他块级元素(如<p></p>) - 段落:
<p></p>是最安全的默认块容器;不要用<div> 替代,除非明确需要无语义分组 <li>引用块:<code><blockquote></blockquote>表示长引用,<q></q>表示行内短引用 - 预格式化文本:
<pre class="brush:php;toolbar:false;"></pre>保留空格与换行,内部可嵌<code>,但注意它不支持execCommand的任何格式化命令 - 搜索引擎和辅助技术依赖语义:用
<strong></strong>而非<b></b>,能让语音朗读器加重语气,SEO 工具可能赋予更高权重 - CSS 重置时容易误伤:
b { font-weight: normal }会干掉所有<b></b>,但不影响<strong></strong>—— 后者靠语义驱动样式,更健壮 -
<i></i>在 HTML5 中被重新定义为“外文、术语、船名等”,不是通用斜体;若只是想让文字斜一点,<em></em>或 CSSfont-style: italic更准确 - 所有格式化标签必须闭合:
<strong>text</strong>,不能写成<strong>text</strong>(XHTML 风格自闭合在 HTML5 中无效) - 避免在
<pre class="brush:php;toolbar:false;"></pre>或<code>内部使用<strong></strong>等——它们是“原始内容容器”,嵌套语义标签会破坏其预格式化意图,且部分读屏器跳过内部格式 - 颜色不可单独依赖:
<span style="color:red"></span>不传达语义;如需警示,用<strong class="error"></strong>+ CSS,并配 ARIA 属性如aria-live="polite"
为什么别混用 <b></b>/<i></i> 和 <strong></strong>/<em></em>
表面看都加粗/斜体,但行为差异实际影响渲染与工具链:
移动端和无障碍容易忽略的细节
纯 HTML 格式化在 iOS Safari 或读屏软件中表现稳定,但有三个硬约束必须遵守:
真正麻烦的从来不是“怎么加粗”,而是“加粗之后,机器是否理解这是重点”。用对标签,比调对 execCommand 参数重要得多。











