点击加粗按钮需先通过事件委托统一捕获，再校验选区安全性：检查是否在contenteditable内、未跨不可编辑节点、非空选区且不在只读区域，并结合编辑器状态拦截受限上下文，失败时提供友好反馈。
在自研富文本编辑器中，点击加粗按钮时不能直接操作 DOM，必须先确认当前光标或选区是否处于可安全格式化的状态——比如是否落在 contenteditable 区域内、是否跨了不可编辑节点、是否为空选区或位于只读段落中。事件委托本身不用于“检查选区”，而是用来统一捕获按钮点击；真正的安全校验发生在委托触发后的处理逻辑里。
用事件委托统一监听加粗按钮点击
将加粗按钮的点击事件绑定到编辑器容器（如 #editor-toolbar），而非每个按钮单独绑定：
- 避免重复监听，便于动态增删按钮
- 利用事件冒泡，通过
event.target.dataset.cmd === "bold"判断是否为加粗指令 - 确保所有格式按钮共用同一入口，后续校验和执行逻辑可复用
点击后立即校验选区安全性
获取选区后需逐层验证，不是“有选区就能加粗”：
- 调用
window.getSelection()，若rangeCount === 0，说明无有效选区，此时应聚焦编辑区并置光标于末尾，而非报错中断 - 取
getRangeAt(0)后，检查range.startContainer是否为可编辑的文本节点或元素节点；若其父级含contenteditable="false"或data-readonly属性，跳过格式化 - 判断是否跨多个块级节点（如同时选中两个
<p></p>），这种情况下surroundContents会失败，应改用分段处理或降级为对各段分别应用格式
结合编辑器状态做前置拦截
仅靠 DOM 选区不够，还需联动编辑器内部状态：
- 检查当前编辑模式：是否处于代码块、表格单元格、嵌入卡片等受限上下文，这些区域通常禁用行内格式
- 确认焦点是否仍在编辑器内（
document.activeElement === editorEl），防止用户切出窗口后误点按钮 - 若使用自定义数据模型（如 JSON 描述的文档树），需同步校验光标对应节点是否允许设置
bold: true，例如标题节点可能锁定字体样式
安全失败时提供友好反馈
校验不通过时不要静默忽略，要给出明确提示或自动修正：
- 光标在空白行？自动激活该行并允许加粗输入
- 选区包含图片或 widget？提示“该内容不支持加粗”，或仅对纯文本部分生效
- 检测到只读段落？高亮显示该段并禁用按钮，而不是让点击无响应
