代码转 HTML 高亮

把代码先做 HTML 转义,再对关键字、字符串、数字、注释加上 span 高亮,输出可直接嵌入网页的 HTML 片段。支持 JavaScript、HTML、CSS、JSON 四种语言,全部在浏览器本地完成,代码不会上传服务器。

代码输入 等待输入

选择语言后点击「转换高亮」;按 Ctrl + Enter 可快速转换。输入仅在本机处理,不会上传服务器。

高亮结果
语言 —
代码行数 —
高亮标记 —
输出大小 —
输入代码并点击「转换高亮」,结果将显示在这里。

处理过程全部在浏览器本地完成,数据不会上传。

处理规则
  • 简易高亮,非完整语法解析,仅供参考:匹配规则基于正则,不做词法 / 语法分析,复杂或嵌套写法可能与真实语义存在差异。
  • 第一步先做 HTML 转义:&、<、>、" 会被替换为实体,因此代码里的标签不会被浏览器当作真实标签解析。
  • 第二步再对匹配到的片段加上 <span class="tok-*">,例如关键字 tok-key、字符串 tok-str、数字 tok-num、注释 tok-com、标签 tok-tag。
  • 支持 JavaScript、HTML、CSS、JSON 四种语言,每种语言有各自的关键字表与匹配规则,选择语言后按对应规则高亮。
  • HTML 语言的匹配在已转义文本上进行(如 &lt;a&gt;),因此断言 Core.toHtml('<a>',{lang:'html'}).html 中一定包含 &lt;a&gt;。
  • 输出为可直接嵌入的 HTML 片段,不包含 <style>,配色由本页 CSS 的 .tok-* 类提供,可自行复制样式。
  • 所有处理都在浏览器本地完成,不发起任何网络请求,代码内容不会上传。