无需登录 数据私有 本地保存

HTML空格实体可视化 - 查看不可见空白

13
0
0
0

HTML 空格实体可视化工具

粘贴文本，直观查看隐藏的空白字符——空格、制表符、换行符、零宽字符等不可见字符一目了然

字符数：0
0
普通空格
0
制表符 Tab
0
换行符 LF
0
回车符 CR
0
CRLF (Windows)
0
不间断空格 NBSP
0
零宽空格 ZWSP
0
全角空格
0
其他零宽字符
0
空白字符总计
空格 · Tab → LF CR ↵ CRLF ↵¶ NBSP ⍽ 零宽空格 ⦰ 全角空格 □ 其他零宽 ◌

不可见空白字符是指在文本中存在但在视觉上不可见或难以区分的字符，如空格、制表符(Tab)、换行符、不间断空格( )、零宽空格等。这些字符虽然看不见，但会影响文本布局、代码编译、数据解析等。在编程、数据处理、网页排版中，不可见字符可能导致难以排查的Bug。使用可视化工具可以快速定位这些隐藏字符，提高工作效率。

  • 普通空格 (U+0020)：最常见的空格，用于分隔单词。
  • 制表符 Tab (U+0009)：用于缩进和对齐，宽度可变（通常等于4或8个空格）。
  • 换行符 LF (U+000A)：Unix/Linux/macOS系统的标准换行符，\n。
  • 回车符 CR (U+000D)：旧版Mac系统的换行符，\r。
  • CRLF (U+000D+U+000A)：Windows系统的标准换行符，\r\n。
  • 不间断空格 NBSP (U+00A0)：HTML实体为 ，用于防止自动换行。
  • 零宽空格 ZWSP (U+200B)：宽度为零的空格，常用于文字水印、隐藏标记。
  • 全角空格 (U+3000)：中文排版中使用的宽空格，宽度等于一个中文字符。

零宽空格（Zero-Width Space，U+200B）是一种宽度为零的Unicode字符，在视觉上完全不可见。它常用于：数字水印（在文本中嵌入隐藏标识）、文字换行提示（告诉浏览器可以在该位置断行）、防止自动合并（在两个字符之间插入以防止被识别为一个词）。在安全领域，零宽字符也被用于隐蔽通信和追踪。由于其完全不可见，使用本工具可以轻松发现它们。

不间断空格（Non-Breaking Space，U+00A0）与普通空格(U+0020)的核心区别在于换行行为：浏览器和文本编辑器不会在不间断空格处自动换行。在HTML中，不间断空格通过 表示，常用于保持数字与单位不分离（如"100 km"）、防止名称换行断开、创建缩进等场景。多个普通空格在HTML中会被合并为一个，而多个 则不会合并。

常用的HTML空白实体包括：&nbsp;（不间断空格）、&ensp;（半角空格宽度）、&emsp;（全角空格宽度）、&thinsp;（窄空格）、&zwnj;（零宽非连接符）、&zwj;（零宽连接符）。对于换行，HTML中使用<br>标签而非实体。在HTML源代码中，普通空格和换行通常直接保留，但连续空格会被合并。

这是因为不同操作系统使用不同的换行符：Windows使用CRLF（\r\n），而Linux/macOS使用LF（\n）。当代码从Windows复制到Linux时，多余的\r可能导致脚本执行失败、Git diff混乱、配置文件解析错误等。使用本工具可以快速识别文本中的换行符类型，并通过dos2unix或编辑器转换。

可以使用正则表达式或文本处理工具清理：text.replace(/\s+/g, ' ')（合并连续空白）、text.trim()（去除首尾空白）、text.replace(/[\u200B-\u200D\uFEFF]/g, '')（去除零宽字符）。对于HTML内容，可以使用text.replace(/&nbsp;/g, ' ')将实体转换回普通空格。本工具的可视化功能可以帮助你先识别问题，再针对性处理。

BOM（Byte Order Mark，字节顺序标记，U+FEFF）是一个特殊的Unicode字符，位于文件开头，用于标识文件的字节序和编码格式。虽然肉眼不可见，但BOM可能导致PHP输出异常、CSS渲染问题、JSON解析失败等。在UTF-8文件中，BOM不是必需的，许多工具链建议使用"UTF-8 without BOM"编码。使用本工具可以发现文本开头的BOM字符。
🔧 相关工具